利用jQuery實現橙色注冊表單驗證代碼



23 89 30



特效描述:利用jQuery實現 橙色注冊 表單驗證 代碼,利用jQuery實現橙色注冊表單驗證代碼

代碼結構

1. 引入CSS

<link rel="stylesheet" href="css/frozenui.css">
<link rel="stylesheet" href="css/login.css">
<link rel="stylesheet" href="css/base.css" />

2. 引入JS

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/base.js"></script>

3. HTML代碼

<div class="c-title">
	<div class="logo">
		<img src="img/login-alipay.png" width="42" height="32" alt="">
	</div>
	<p class="name">某某某某</p>
</div>
<div class="c-login">
	<h1>注冊</h1>
	<form class="loginForm">
		<input type="text" class="userLogo" placeholder="請輸入商戶名稱" lay-verify="required|userName" />
		<input type="text"  placeholder="請輸入手機號碼" lay-verify="phone" />
		<input type="text" class="codeText" placeholder="請輸入驗證密碼" lay-verify="required" />
		<input type="button" class="codeBtn" value="獲取驗證碼" />
		<input type="text" class="userLogo" placeholder="請輸入郵箱" lay-verify="email" />
		<input type="password" placeholder="請輸入密碼" lay-verify="required" />
		<input type="password" placeholder="請輸入確認密碼" lay-verify="required" />
		<input type="button" value="注冊" id="regBtn" />
	</form>
</div>
<script type="text/javascript">
/**
 * 配置驗證須知
 * 1、要引入jquery.js、base.js、base.css
 * 2、提交按鈕應在<form></form>內部
 * 3、在要驗證的input中寫上lay-verify="驗證方法名|驗證方法名" 可寫多個但要用|分隔開
 * 4、要添加驗證方法可在base.js中添加
 * 5、諾只想引用提示彈出:showTip.success("彈出提示內容");、showTip.fall("彈出提示內容")
 * 6、base.css中可以自行修改彈窗樣式
 */
$('#regBtn').click(function(){
	if(!checkInputFunction($('#regBtn'))){
		return false;
	}
	//下面書寫驗證成功后執行的內容
});
</script>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 切換按鈕 表單 表單美化 表單插件 表單美化插件 文本框 text文本框 注冊框 表單驗證 表單驗證插件
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

老夫子电子 江西多乐彩11选5 云南十一选五基本走 香港九龙图库精选资料 金鲨银鲨棋牌游戏? 贵阳小姐上门按摩 写影评赚钱的正规网 湖南麻将怎么打 重庆幸运农场热号 体球网体球网足球篮球 济南按摩俱乐部 007球棎网足球即时比分球探比分 _百家乐网上赌场 美人捕鱼网页游戏 广东福彩36选7好彩3 哈灵浙江杭州麻将下载 吉林麻将吉祥棋牌app