3
回答
jquery validate 在 微信里页面里不起作用,且造成form无法正常ajaxSubmit
利用AWS快速构建适用于生产的无服务器应用程序,免费试用12个月>>>   

代码如下, 开发微信里的web页面,用 jquery mobile, jquery validate, jquery form. 现象是: alert("user page create" )显示以后,页面就停滞,不能正常显示, 将validate部分却掉,则能正常显示和提交。高手指教,谢谢。 

<script type="text/javascript">

    function showResponse(jsonData) {  alert(jsonData.msg); }    
    function showRequest(){ 
    alert("checking");
        //return $("#userInfoForm").valid();   
    }
    
    $(document).on("pagecreate", function() {
    alert("user page create");
         $('#userInfoForm').submit(function(){
        alert("form submiting");
            $(this).ajaxSubmit({
              type:"post",
              url:"/pay/updateUserInfo",
              clearForm:false,   //成功提交后不清空form
              resetForm:false,   //成功提交后不重置form
              beforeSubmit:showRequest,
              dataType:"json", // 回传数据格式为json
              success:showResponse
            });
            return false; //此处必须返回false,阻止常规的form提交
          });
        
         $('#userInfoForm').validate({
             onkeyup:false,
             onclick:false,
             focusCleanup:true,
             focusInvalid:false,
             onfocusout: function(element) { $(element).valid(); },
             errorClass: "unchecked",
             validClass: "checked",
             errorElement: "span",
             
             rules:{ //表单名称形如 user.name,则必须用双引号引起来,  如果是  name  则不用。
                 "user.name":{required:true,minlength:2},
                 "user.email":{required:true,email:true},
                 "user.mobile":{required:true, digits:true }
             },
             messages: {
                 "user.name":{required:"请输入姓名。", minlength:"用户名不能少于两个字符。" },
                 "user.email":{required:"请输入email。", email:"不是email的合法格式。" },
                 "user.mobile":{reqired:"请输入手机号码。", digits:"手机号码只能是数字。" },
             },
             errorPlacement: function( error, element ) { // 将提示信息放在对应输入框的下面, 缺省是在右边。
                 error.insertAfter( element.parent() );
                 }
         });
         
     });
   </script>


<body>   
<div data-role="page" id="page_userEdit">
  <div data-role="header">    <h1>填写个人信息</h1>  </div>
<div data-role="content">
    <form method="post" id="userInfoForm" data-ajax="false">
   <!-- Jquery Mobile 的form默认为Ajax提交,故此处禁止,以实现页面切换 -->
     <div class="ui-field-contain">    
        <label for="fname">姓名:</label>
        <input type="text" name="user.name" id="fname" value="${user.name}">
        <label for="fmobile">手机号:</label>
        <input type="text" name="user.mobile" id="fmobile" value="${user.mobile}">
        <label for="femail">邮箱:</label>
        <input type="text" name="user.email" id="femail" value="${user.email}">
        <input type="submit" data-inline="true" value="确认提交" >
      </div>    
      <input type="hidden", name="user.id"   value="${userId}">  
   </form>
 
</div> <!-- match content -->
<div>
 <div data-role="footer">
   <h1>关闭</h1>
 </div>
</div> 
</div>
</body>


举报
悠悠河
发帖于1年前 3回/378阅
顶部