循環jquery/ajax函數？

我有我使用的以下ajax/jquery代碼，如果用戶提交了錯誤的登錄詳細信息，我的div圍繞登錄表單被翻轉，並告知用戶他們輸入了錯誤的登錄詳細信息，反之亦然，如果用戶提交正確的登錄細節它翻轉div並且說登錄細節是正確的。循環jquery/ajax函數？

但是，如果我的用戶輸入了錯誤的用戶名或密碼，並且div被翻轉，那麼它會告訴他們他們輸入了錯誤的登錄詳細信息，然後再次嘗試並輸入正確的詳細信息，div不會翻轉，用戶必須刷新jquery的工作頁面。

這是有原因嗎？請有人告訴我我做錯了什麼？感謝

我使用下面的翻轉插件： http://lab.smashup.it/flip

<script src="assets/jquery/jquery.min.js"></script> 
<script type="text/javascript" src="assets/jquery/flip/jquery.flip.js"></script> 
<script type="text/javascript" src="assets/jquery/flip/jquery.flip.min.js"></script> 
<script src="assets/jquery/jquery-ui.js"></script> 



<script type="text/javascript"> 
$(document).ready(function() { 
    $("#submit").click(function() { 
     var myusername = $("#myusername").val(); 
     var mypassword = $("#mypassword").val(); 
     if (myusername == null || myusername == "" || mypassword == null || mypassword == "") { 
      if (myusername == null || myusername == "") { 
       document.forms["form"]["myusername"].style.border = "2px solid #963634"; 
      } 
      if (mypassword == null || mypassword == "") { 
       document.forms["form"]["mypassword"].style.border = "2px solid #963634"; 
      } 
      $(".home_column").effect("shake"); 
     } else { 
      // Returns successful data submission message when the entered information is stored in database. 
      $.post("include/validate_login.php", { 
       username1: myusername, 
       password1: mypassword 
      }, function (data) { 
       if (data == 'login_wrong') { 
        $(".home_column").flip({ 
         direction: 'lr', 
         color: 'rgba(138, 138, 138, 0.2)', 
         content: '<h2s1>Incorrect Login Details</h21>' 
        }) 
        setTimeout(function() { 
         $(".home_column").revertFlip() 
        }, 2500); 
       } else { 
        if (data == 'login_success') { 
         $(".home_column").flip({ 
          direction: 'lr', 
          color: 'rgba(138, 138, 138, 0.2)', 
          content: '<h2s1>correct Login Details</h21>' 
         }) 
         setTimeout(function() { 
          $(".home_column").revertFlip() 
         }, 2500); 
        } 
       } 
       $('#form')[0].reset(); // To reset form fields 
      }); 
     } 
    }); 
}); 

</script>

來源

2015-03-03 Kevin Parks

您使用哪種jQuery插件進行翻轉效果？ – alkis 2015-03-03 12:53:49

@alkis請參閱jquery插件詳細信息的更新問題 – 2015-03-03 12:54:51

您已使用我們無法訪問的本地資源更新。與半相關：您包含同一個插件的完整版本和縮小版本！ – Jamiec 2015-03-03 12:55:11

它看起來像翻轉！插件不會在某個時候保存事件處理程序，或者發生翻蓋或者調用revertFlip()方法。所以，當你顯示一條消息，然後恢復顯示登錄表單後，你的處理程序就不存在了。

您可以使用事件委託來將更高級別的處理程序附加到DOM中，以便它能夠在Flip！正在做顯示/隱藏的東西。改變這一行：

$('#submit').click(function() {

要這樣：

$(document).on('click', '#submit', function() {

之後你這樣做，你並不真的需要來包裝整個事情$(document).ready()無論是。使用它不會阻止任何工作，但可能會稍微減慢該處理程序需要多長時間才能生效：http://encosia.com/dont-let-jquerys-document-ready-slow-you-down/

來源

2015-03-03 13:35:19

非常感謝 – 2015-03-03 15:07:23

循環jquery/ajax函數？

回答

相關問題