首页 > 华企学院 > 电脑知识图文教程 > 用js实现163网易邮箱注册界面

用js实现163网易邮箱注册界面

作者:华企商城小编  浏览量:168   发布时间:2016-09-04 06:43:09

用js实现163网易邮箱注册界面

[javascript] view plain copy 在CODE上查看代码片派生到我的代码片

  1. <!DOCTYPE html>  

  2. <html>  

  3. <head lang="en">  

  4.     <meta charset="UTF-8">  

  5.     <title>mischen</title>  

  6.     <script>  

  7.         function check(frm){  

  8.             var uname=frm.uname.value;  

  9.             var pwd1=frm.pwd1.value;  

  10.             var pwd2=frm.pwd2.value;  

  11.             var fs=frm.favorite;  

  12.             var fs_no=false;  

  13.             var uname_ok=true;  

  14.             var pwd1_ok=true;  

  15.             var pwd2_ok=true;  

  16.             document.getElementById("unameError").innerHTML="";  

  17.             document.getElementById("pwd1Error").innerHTML="";  

  18.             document.getElementById("pwd2Error").innerHTML="";  

  19.             document.getElementById("favoriteError").innerHTML="";  

  20.   

  21.             if(uname.length<6||uname.length>18){  

  22.                 document.getElementById("unameError").innerHTML="长度应该是6~18";  

  23.                 uname_ok=false;  

  24.             }  

  25.             if(pwd1.length<6||uname.length>16){  

  26.                 document.getElementById("pwd1Error").innerHTML="密码长度应该是6~16";  

  27.                 pwd1_ok=false;  

  28.             }  

  29.             if(pwd1!=pwd2){  

  30.                 document.getElementById("pwd2Error").innerHTML="两次输入的密码不一致";  

  31.                 pwd2_ok=false;  

  32.             }  

  33.             for(var i=0;i<fs.length;i++){  

  34.                 if(fs[i].checked){  

  35.                     fs_no=true;  

  36.                     eak;  

  37.                 }  

  38.             }  

  39.             if(!fs_no){  

  40.                 document.getElementById("favoriteError").innerHTML="请至少选择一个爱好";  

  41.             }  

  42.             return uname_ok&&pwd1_ok&&pwd2_ok&&fs_no;  

  43.         }  

  44.     </script>  

  45. </head>  

  46. <body>  

  47.     <center>  

  48.         <h1>163网易邮箱注册界面</h1>  

  49.         <hr size="5" color="blue">  

  50.         <>  

  51.         <form action="a.jsp" onsubmit="return check(this);">  

  52.          * 邮件地址:<input type="text" name="uname">@  

  53.             <select name="sel">  

  54.                 <option value="163.com" selected>163.com</option>  

  55.                 <option value="126.com">126.com</option>  

  56.                 <option value="yeah.net">yeah.net</option>  

  57.             </select>  

  58.             </input><>  

  59.             <div id="nameTips" class="tips" style="ime-mode:disabled;color:#999;font-weight:normal">  

  60.                 <span class="txt-tips">6~18个字符,可使用字母、数字、下划线,需以字母开头</span>  

  61.             </div>  

  62.     <span style="color:red;" id="unameError"></span></>  

  63.         * 密码:<input type="password" name="pwd1"><>  

  64.             <div style="ime-mode:disabled;color:#999;font-weight:normal">  

  65.             <span class="txt-tips">6~16个字符,区分大小写</span>  

  66.             </div>  

  67.     <span style="color:red;" id="pwd1Error"></span></>  

  68.         * 确认密码:<input type="password" name="pwd2"><>  

  69.             <div style="ime-mode:disabled;color:#999;font-weight:normal">  

  70.                 <span class="txt-tips">请再次填写密码</span>  

  71.             </div>  

  72.     <span style="color:red;" id="pwd2Error"></span></>  

  73.         爱好:<input type="checkbox" name="favorite" value="1">唱歌  

  74.              <input type="checkbox" name="favorite" value="2">跳舞  

  75.              <input type="checkbox" name="favorite" value="3">游泳  

  76.              <input type="checkbox" name="favorite" value="4">跑步  

  77.         <span style="color:red;" id="favoriteError"></span></>  

  78.         <input type="submit" value="提交"/>    

  79.         <input type="reset" value="重置"/>  

  80.   

  81.     </form>  

  82.         </center>  

  83. </body>  

  84. </html>  

华企商城更多商品介绍:网站访客qq获取系统     博客批量发帖工具    站内运维站外监测

文章转载请注明出处:http://www.netshop168.com/article-8639.html


精品推荐
下一篇:修改已经存在百科词条创建的技巧
上一篇:介绍一下怎么删除百度搜索记录呢?
相关文章

华人企业网
关注微信公众号
享受更多优惠

 

消费者最喜爱的网站TOP100 | | 网络社会征信网 | 北京工商 | 法律顾问 | 京ICP备07504386号-6 | 网站地图