JavaScript简单的表单提交验证


这里是一个简单的JavaScript简单的表单提交验证希望对你有所帮助,下面是html和JS部分,直接拷过去即可使用,试一下吧。


HTML部分

#
#
<form class="form-horizontal js-ajax-form" action="" method="post"  onsubmit="return register_submit()">
    手机:<input type="text" id="new_tel" name="mobile" placeholder="手机号" class="form-control" >
    密码:<input type="password" id="password" name="password"  class="form-control" placeholder="密码(6-16位字母、数字、无空格)">
    确认密码:<input type="password" id="repassword" name="repassword" class="form-control" placeholder="确认密码(6-16位字母、数字、无空格)">
    协议:<input type="checkbox" checked="checked" class="inp-chk" name="is_agree" id="agree" value="1" > 我已阅读并同意遵守 <a href="readtxt.html" target="_blank">《协议》</a>
    <input type="submit" class="btn" value="立即注册" >
</form>
#
#


JS部分

#
#
<script>
function register_submit(){
    //判断手机
    var tel = document.getElementById("new_tel").value;
    var re = /^1[34578]\d{9}$/;
    if(!tel.match(re)){
        alert("请填写正确手机号码!");
        return false;
    }

    //判断密码
    var password = document.getElementById("password").value;
    var re_pwd = /^[A-Za-z0-9]+$/;
    if(!password.match(re_pwd)){
        alert("密码请输入字母或数字");
        return false;
    }
    if(password.length < 6 || password.length >16){
        alert("密码请输入6-16位数字或字母");
        return false;
    }
    //判断确认密码
    var repassword = document.getElementById("repassword").value;
    if(repassword != password){
        alert("两次密码不一致,请重新确认密码!");
        return false;
    }

    //判断验证码
    var verify_o = document.getElementById("verify_o").value;
    if(verify_o != 'OK'){
        alert("请输入正确的验证码!");
        return false;
    }

    //判断是否遵守协议
    var is_agree = document.getElementById("agree");
    if(is_agree.checked != true){
        alert("请认真阅读《协议》,并勾选注册!");
        return false;
    }
}
</script>
#
#

JavaScript简单的表单提交验证

上一篇