码迷,mamicode.com
首页 > 其他好文 > 详细

表单验证制作注册页面

时间:2017-12-10 23:05:43      阅读:177      评论:0      收藏:0      [点我收藏+]

标签:script   不能   put   log   注册页面   验证   false   eth   pre   

<body>
  <form action="好友列表.html" method="get">
    <div>
      用户名:<input type="text" name="name" id="name" />
    </div>
    <div>
      密码:<input type="text" name="mima1" id="mima1" />
    </div>
    <div>
      确认密码:<input type="text" name="mima2" id="mima2" />
    </div>
    <div>
      邮箱:<input type="text" name="email" id="email" /> 
    </div>
    <div>
      <input type="submit" value="注册" onclick="return check()" />
    </div>
  </form>
</body>
<script type="text/javascript">
  var n = document.getElementById("name");
  var m1 = document.getElementById("mima1");
  var m2 = document.getElementById("mima2");
  var e = document.getElementById("email");
  
  function check(){
    if(n.value==""){
        alert("用户名不能为空");
        return false;
    }
    
    if(m1.value!=m2.value){
        alert("两次输入的密码不相同!");
        return false;
    }
    
    var reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
    if(email.value.match(e)==null){
        alert("邮箱输入不正确!");
        return false;
    }
  }

</script>

在标签中onclick属性上加入“return”,表示返回值。在JS内如果写“return false”,代表阻止提交;将“false”换成“true”,就表示可以提交。

 

表单验证制作注册页面

标签:script   不能   put   log   注册页面   验证   false   eth   pre   

原文地址:http://www.cnblogs.com/maoqiaoyu123/p/8017119.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!