简单的jQuery表单正则验证和提交

HTML结构如下:

id="yuyueform" class="yuyueform" target="_blank" method="post" action=""> <div class="input_wrap input_name"> "text" id="name" value="" name="name" class="input_txt" placeholder="姓名" > div> <div class="input_wrap input_phonenum"> "text" id="phonenum" value="" name="phonenum" class="input_txt" placeholder="联系方式" > div> <div class="button_content">id="OpenUser" href="javascript:;">立即提交div>

首先是先把正则写好,可以这样:

            // 验证中文名称
            function isChinaName(name) {
     
             var pattern = /^[\u4E00-\u9FA5]{1,6}$/;
             return pattern.test(name);
            }

            // 验证手机号
            function isPhoneNo(phone) {
      
             var pattern = /^1[34578]\d{9}$/; 
             return pattern.test(phone); 
            }

function SubmitMsg(){
     
    var name = $("#name").val();
    var phonenum = $("#phonenum").val();
    if(name.length == 0){
          layer.alert('请输入你的用户名');
          $("#name").focus();
          return false;
    }

    if(isChinaName(name) == false){
        layer.alert('用户名不合法');
         $("#name").focus();
          return false;
    }


    if(phonenum.length == 0){
            layer.alert('请输入你的手机号');
            $("#phonenum").focus();
          return false; 
    }

    if(isPhoneNo(phonenum) == false){
        layer.alert('手机号格式不正确');
            $("#phonenum").focus();
          return false;         
    }
    $.ajax({
                 type : 'post',
                 dataType : 'json',
                 url : '提交地址....',
                 data:{name:name,phonenum:phonenum},
                 success:function(data){
     
                      if(data.status == 2){
                         layer.alert('提交成功');
                           $("#name").val('');
                          $("#phonenum").val('');
                        }else{
                        layer.alert('你是怎么找到我的 - -');
                      }
                 }
     });    
}    

最后绑定事件:

$(document).ready(function(){
     
    $("#OpenUser").bind('click',SubmitMsg);
});

你可能感兴趣的:(Jquery,PHP,jquery,正则,表单,结构,html)