輸入表格不工作時，從jquery調用它不工作ajax

Question

對不起，但我是完全新手的AJAX和jQuery，如果我問問題荒謬的問題。

基本上我有一個像下面的形式;

<form id="login_form" > 
<input type="text" id="inputEmail" name="username"> 
<input type="password" id="inputPassword" name="password"> 
<div id="MyDynamicDiv"></div> 
<button id="signin" name="signin" type="submit">button</button> 
</form> 

<script> 
$("#login_form").submit(function() { 
      if ($("#login_form").valid()) { 
        $('.messagebox').slideUp('slow'); 
        var data1 = $('#login_form').serialize(); 
          $("button").button('loading'); 
        $.ajax({ 
         type: "POST", 
         url: "login/login.php", 
         data: data1, 
          dataType: 'json', 
         success: function(msg) { 
if (msg.result == 12) { 
$('#MyDynamicDiv').load('captcha.php'); 
} 
if (msg.result == 1) {  
     $('.messagebox').addClass("success-message"); 
     $('.message').slideDown('slow'); 
      $('#alert-message').text("...."); 
       $('#login_form').fadeOut(5000); 
        window.location = "members.php" 
        } else { return false;} 
</script> 

和我captcha.php是

<input type="text" name="captcha_code"> 
<img id="captcha" src="/test/securimage/securimage_show.php"> 
<a href="#" id="captcha_link" onclick="document.getElementById('captcha').src = '/test/securimage/securimage_show.php?' + Math.random(); return false">[ Different Image]</a> 

也登錄/ login.php中包括

echo json_encode(array('result'=>12)); 

我行打電話captcha.php但是和在頁面上顯示出來，表單不適用於驗證碼輸入。我應該以不同的方式稱呼它，我無法找到任何我應該做的事情。

編輯： 它似乎captcha_code的輸入值不發送/發佈正確。如果我使用嵌入到登錄表單中的captcha.php代碼，則不起作用。 在此先感謝，

Answer 1

它出現您的驗證碼輸入是在<form>元素之外，因此它將不會包含在POST數據當您serialize()窗體。移動表單元素中的輸入。

你似乎錯過了一些右括號和大括號。

從成功函數做return false什麼都不做，因爲異步性質。相反，您應該從提交事件返回false，或者防止默認。

帶有註釋的變化（假設你移動的驗證碼輸入）更正代碼：

$("#login_form").submit(function (e) { // capture event 
    e.preventDefault(); // always prevent the form from submitting 
    if ($("#login_form").valid()) { 
     $('.messagebox').slideUp('slow'); 
     var data1 = $('#login_form').serialize(); 
     $("button").button('loading'); 
     $.ajax({ 
      type: "POST", 
      url: "login/login.php", 
      data: data1, 
      dataType: 'json', 
      success: function (msg) { 
       if (msg.result == 12) { 
        $('#MyDynamicDiv').load('captcha.php'); 
       } 
       if (msg.result == 1) { 
        $('.messagebox').addClass("success-message"); 
        $('.message').slideDown('slow'); 
        $('#alert-message').text("...."); 
        $('#login_form').fadeOut(5000); 
        window.location = "members.php" 
       } 
      } // was missing 
     }); // was missing 
    } // was missing 
}); // was missing 

對於未來的調試，記住要檢查錯誤控制檯（F12），並縮進代碼，因爲它使失蹤括號更明顯。您可以使用JSFiddle的TidyUp功能自動縮進它。