jQuery驗證只適用於頁面刷新

我在我的網站上有this jsFiddle的代碼。該代碼正是我的網站上實現的，除了我的網站在<meta>標籤之後還有<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>（因爲jsFiddle會自動調用它;它存在於下面的代碼中）。代碼在jsFiddle上按預期工作，但在我的網站上，驗證不起作用，除非在第一次提交後刷新頁面或單擊後退按鈕。表單重定向到logins.php腳本（現在空白），按下後退按鈕後，驗證工作正常。我在表單上有data-ajax="false"。我可以做什麼以便表單驗證始終有效，而不僅僅是刷新或返回之後？jQuery驗證只適用於頁面刷新

下面的代碼：

<!DOCTYPE html> 
<html> 
<head> 
    <title>Welcome</title> 

    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script> 
    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      $("#loginForm").validate(); 
     }); 
    </script> 
    <style type="text/css"> 
     label.error { 
      font-weight:bold; 
      color:red; 
     } 
    </style> 
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 

</head> 
<body> 
    <div data-role="page" id="login"> 
     <div data-role="header"><h1>Log In</h1></div> 
     <div data-role="content">You can use the fields below to log in to your account.<br> 
     <br> 
     <form action="logins.php" method="POST" id="loginForm" name="loginForm" data-ajax="false"> 
      <label for="email" class="ui-hidden-accessible">Email Address:</label> 
      <input type="text" id="email" name="email" value="" class="required email" minlength="5" placeholder="Email Address" /> 
      <label for="pass" class="ui-hidden-accessible">Password:</label> 
      <input type="password" id="pass" name="pass" value="" class="required" minlength="5" placeholder="Password" /> 
      <input class="submit" data-role="submit" type="submit" value="Submit" /> 
     </form><br> 
     <br> 
     <a href="index.php" data-role="button" data-transition="slide" data-direction="reverse">Return to home page</a> 
     </div> 
     <div data-role="footer"><h4>&copy; Me 2013</h4></div> 
    </div> 
</body> 
</html>

來源

2013-01-09 vaindil

總是在你的問題中包含你的代碼，因爲不能保證jsfiddle永遠在那裏，沒有它你的問題就會失去所有的上下文。 – Madbreaks

完成。對不起，謝謝！ – vaindil

你可以顯示腳本標籤的確切位置嗎？ – epascarello

http://jquerymobile.com/demos/1.2.0/docs/api/events.html

$(document).ready()不應與jQuery Mobile的使用。改爲使用$(document).bind("pageinit")。

此外，jQuery Mobile 1.2支持jQuery Core 1.8.2（不是1.8.3）。

來源

2013-01-09 19:01:21 andleer

我曾嘗試過，但是當我做到這一點時，我將它保留在頭部。我將它移動到頁面底部（如演示中所引用的：http://jquery.bassistance.de/validate/demo/jquerymobile.html），它現在可以工作。非常感謝！ – vaindil

jQuery驗證只適用於頁面刷新

回答

相關問題