您好,登錄后才能下訂單哦!
這篇文章主要講解了“怎么用js代碼完整注冊表單驗證及郵箱補齊”,文中的講解內容簡單清晰,易于學習與理解,下面請大家跟著小編的思路慢慢深入,一起來研究和學習“怎么用js代碼完整注冊表單驗證及郵箱補齊”吧!
代碼如下:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>完整注冊表單驗證及郵箱補齊js特效代碼</title>
<meta name="keywords" content="完整,注冊表單,表單驗證,郵箱補齊,js特效,特效代碼" />
<meta name="description" content="完整注冊表單驗證及郵箱補齊js特效代碼,非常實用,可以直接應用到網站注冊項目。" />
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/normalize.css" rel="stylesheet">
<link href="css/public.css" rel="stylesheet">
<link href="css/validator.css" rel="stylesheet">
<link href="css/completer.css" rel="stylesheet">
<link href="jedate/skin/jedate.css" rel="stylesheet">
<link href="css/date.css" type="text/css" rel="stylesheet">
<link href="css/magic-check.css" rel="stylesheet" >
<link href="css/jquery-ui.css" rel="stylesheet">
<link href="css/index.css" rel="stylesheet">
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/public.js"></script>
<script type="text/javascript" src="jedate/jedate.js"></script>
<script type="text/javascript" src="js/date.js"></script>
<script type="text/javascript" src="js/jquery-validate.js"></script>
<script type="text/javascript" src="js/validator.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<!--[if lt IE 9]>
<script src="http://cdn.static.runoob.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<header>
</header>
<div class="container">
<div class="form-box row">
<form action="" class="form-horizontal" role="form" id="register-form">
<div class="form-group">
<label for="username" class="col-sm-2 control-label">帳 號 :</label>
<div class="col-sm-10 input-parent">
<input type="text" class="form-control vinput" id="username" name="username" placeholder="請輸入帳戶" >
<span></span>
</div>
</div>
<div class="form-group">
<label for="phone" class="col-sm-2 control-label">手 機 :</label>
<div class="col-sm-10 input-parent">
<input type="text" class="form-control vinput" id="phone" name="telephone" placeholder="請輸入手機號">
<span></span>
</div>
</div>
<div class="form-group ">
<label for="email" class="col-sm-2 control-label">郵 箱 :</label>
<div class="col-sm-10 input-parent">
<input type="text" class="form-control vinput" id="email" name="email" placeholder="請輸入郵箱"/>
<span></span>
</div>
</div>
<div class="form-group">
<label for="birthday" class="col-sm-2 control-label">生 日 :</label>
<div class="col-sm-10 input-parent">
<input type="text" class="form-control vinput" id="birthday" name="birthday" placeholder="請選擇生日" readonly>
<span></span>
</div>
</div>
<div class="form-group ">
<label for="password" class="col-sm-2 control-label">密 碼 :</label>
<div class="col-sm-10 input-parent">
<input type="password" class="form-control vinput" id="password" name="password" placeholder="請輸入密碼"/>
<i class="glyphicon glyphicon-eye-close form-control-feedback" id="toogle-password"></i>
<span></span>
</div>
</div>
<div class="form-group">
<label for="notpass" class="col-sm-2 control-label">確認密碼 :</label>
<div class="col-sm-10 input-parent">
<input type="text" class="form-control vinput" id="notpass" name="notpass" placeholder="請再次輸入密碼"/>
<i class="glyphicon glyphicon-eye-close form-control-feedback" id="toggle-notpass"></i>
<span></span>
</div>
</div>
<br>
<div class="form-group">
<div class="col-sm-12">
<input type="checkbox" class="magic-checkbox" id="accept" name="accept" />
<label for="accept" class="accept"><span>我已閱讀并接受</span> <a href="javascript:;">《版權聲明》</a> <span>和</span> <a href="javascript:;">《隱私保護》</a></label>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<input type="submit" class="btn btn-primary form-control" id="submit" value="注冊"/>
</div>
</div>
</form>
</div>
</div>
<footer>
</footer>
</body>
</html>
感謝各位的閱讀,以上就是“怎么用js代碼完整注冊表單驗證及郵箱補齊”的內容了,經過本文的學習后,相信大家對怎么用js代碼完整注冊表單驗證及郵箱補齊這一問題有了更深刻的體會,具體使用情況還需要大家實踐驗證。這里是億速云,小編將為大家推送更多相關知識點的文章,歡迎關注!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。