你的位置:首页 > 软件开发 > Java > 简单的注册模块表单验证处理

简单的注册模块表单验证处理

发布时间:2015-04-10 14:02:30
一个注册框 进行表单验证处理如图有简单的验证提示功能具体可以 查看演示 代码思路也比较简单输入框失去焦点时便检测,并进行处理表单具有 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 (#换成@)。

可能感兴趣文章

我的浏览记录