一个注册框 进行表单验证处理如图有简单的验证提示功能具体可以 查看演示 代码思路也比较简单输入框失去焦点时便检测,并进行处理表单具有 onsubmit = "return check()"行为,处理验证情况点击提交表单按钮时,进行最终的验证,达 ...
一个注册框 进行表单验证处理
如图
有简单的验证提示功能
具体可以 查看演示
代码思路也比较简单
输入框失去焦点时便检测,并进行处理
表单具有 onsubmit = "return check()"行为,处理验证情况
点击提交表单按钮时,进行最终的验证,达到是否通过表单提交的请求。
先是最基本的html+css部分
1 <style type="text/css"> 2 body{margin:0;padding: 0;} 3 .login{position:relative;margin:100px auto;padding:50px 20px;width: 350px;height: 200px;border:1px solid #333;} 4 .login legend{font-weight: bold;color: green;text-align: center;} 5 .login label{display:inline-block;width:130px;text-align: right;} 6 .btn{height: 30px;width:100px;padding: 5px;border:0;background-color: #00dddd;font-weight: bold;cursor: pointer;float: right;} 7 input{height: 20px;width: 170px;} 8 .borderRed{border: 2px solid red;} 9 img{display: none;}10 </style>11 </head>12 <body>13 <div class="login">14 <form name="form" method="post" action="register.php" onsubmit="return check()">15 <legend>【Register】</legend>16 <p><label for="name">UserName: </label>17 <input type="text" id="name" >18 <img src='/images/loading.gif' data-original="./img/gou.png" width="20px" height="20px"></p>19 <p><label for="password">Password: </label>20 <input type="password" id="password" >21 <img src='/images/loading.gif' data-original="./img/gantan.png" width="20px" height="20px"></p>22 <p><label for="R_password">Password Again: </label>23 <input type="password" id="R_password" >24 <img src='/images/loading.gif' data-original="./img/gou.png" width="20px" height="20px"></p>25 <p><label for="email">Email: </label>26 <input type="text" id="email" >27 <img src='/images/loading.gif' data-original="./img/gou.png" width="20px" height="20px"></p>28 <p><input type="submit" value="Register" class="btn"></p>29 </form>30 </div>
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:简单的注册模块表单验证处理
关键词:
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。