Jquery Mobile中没有页面刷新，Jquery验证无法正常工作。

Question

我在我的jQuery移动应用中使用jquery validate.js来验证联系表单。 当我通过URL加载页面或刷新页面时，验证似乎工作得很完美。 但是当我从另一个已经刷新的页面链接返回到联系表单时，验证停止工作。

当我刷新页面时它能正常工作。 我尝试了以下方法：

1）在jQuery mobile js之前包含contact.js。

2）data-ajax="false"；

3）使用bind。

$(document).bind("mobileinit", function(){
      $.extend(  $.mobile , { ajaxEnabled: false });
});

4) 使用jQuery Mobile刷新表单页面

5) 使用window.onload

window.onload = function() {
   if(!window.location.hash) {
    window.location = window.location + '#loaded';
    window.location.reload();
 }
}

5) Jquery-Mobile: 如何重新加载/刷新内部页面

6) 首次页面加载后仅进行一次页面刷新 jQuery移动中仅在页面刷新时工作的Javascript

但这些方法都没有奏效。我需要做的是在导航到页面时刷新一次页面。 以下是我的jQuery Mobile联系表单代码。

<form method="post" action="" id="feedback" name="feedback">
     <input type="text" name="user_name" data-role="none" id="name" value="" placeholder= "Your name*" />
     <br />
     <input class="email" required="true" type="text" name="user_email" data-role="none" id="email" value="" placeholder="Your Email*" />
    <br />
    <textarea cols="70" rows="12" class="required" name="user_message" id="c_message" data-role="none" placeholder="Your message*">
   </textarea>
   <br />
   <input type="submit" value="Send" data-mini="true" data-role="none" data-inline="true" class="green_like" id="send" />
</form>

这里是在“联系我们”表单中的JS代码。

$(document).bind("pageinit",function(){

  $("#feedback").validate({

    submitHandler : function() {
        $.ajax({
            type:'POST',
            url :'/some/url',
            data: $('#feedback').serialize(),
            success: function(resp) {
                if(resp==1)
                {   
                    $("#success_post_contact").html('<label style="color:green;margin-left: 6px;" >Thank you for contacting us.</label>');

                }

            }
        });//end of ajax

     }//end of submit handler
   });//end of validate
});//end of document.bind

- Nagama Inamdar

Answer 1

你没有尝试正确的方法。要理解这种情况，你需要了解jQuery Mobile的工作原理。它使用ajax来加载其他页面。

第一页通常会被加载。它的HEAD和BODY被加载到DOM中，并等待其他内容。当第二页被加载时，只有它的BODY内容被加载到DOM中。当我说只有BODY内容时，我的意思是只有一个页面DIV（带有属性data-role="page"），没有其他内容。这个问题有几个解决方案，这里是一个list。

- Gajotres

---

是的，那就是我做错了。现在我在页面开始后立即包含了我的js文件，现在它完美地工作了。非常感谢您的答案。我花了3个小时来处理这个问题，现在它已经解决了。 :) - Nagama Inamdar