2013-07-05 26 views
1

工作我想使用此代碼:AJAX不是沒有警告框

$('#form1').on('submit', function(){ 
    var txtItemCode = $('#txtItemCode').val(); 
    $.post("userExist.php", { 
     txtItemCode: txtItemCode, 
    }, function(data,status){ 
     //alert("Data: " + data + "\nStatus: " + status); 
     $('#status').html(data);  
     reply = data; 
     //alert(reply); 
    }); 
    alert(''); 
    if (reply=='OK'){ 
     return false; 
    } 
}); 

我需要檢查,如果data=="OK"並返回false,但是當我刪除alert,它不再起作用。這是爲什麼,我該如何使它工作?

+0

如果你發佈一個完整的例子給jsfiddle,那會很棒,我們確實需要多一點信息,但是你應該在線程中獲得所有新聞信息 – Mataniko

+0

看看這個問題:http:// stackoverflow.com/q/16090545/218196,特別是這個答案:http://stackoverflow.com/a/16090709/218196。你在這裏得到的所有答案都是劣等的IMO。 –

回答

4

當您引入警報時,它工作的原因是因爲它停止執行並且爲異步調用完成提供足夠的時間。

你沒有得到正確的價值,因爲當發佈請求完成並且回調被執行時,你的javascript已經完成執行。

您有幾種選擇在這裏:

  1. 聲明一個全局變量並進行同步調用,您可以用ABC張貼或您的POST調用之前調用$.ajaxSetup({ async: false })代碼做到這一點。將返回值分配給全局變量並根據該值進行驗證。
  2. 使用jQuery的ajaxStop:$(document).ajaxStop(function() { //check your values here, still need to declare a global });
  3. 值/ DOM中的任意位置寫入一個隱藏的div作爲屬性,並有一個計時器,定期檢查,直到有一個值。
+0

我覺得很好奇,JavaScript引擎會在進行「alert」時調用AJAX事件處理程序。 – icktoofay

+0

是的,它使用您的選項之一,在POST調用之前添加$ .ajaxSetup({async:false})。感謝所有幫助初學者。 – sam

3

在你的代碼中,ajax調用是異步的,所以不管你是否響應,你的下一行都會被執行。在同步調用你的下一行將不會被執行,直到你得到迴應。 您可以從$ .post變爲$ .ajax,並使async屬性爲false。然後你就可以得到,然後你可以在ajax調用響應後得到「回覆」的值。

$.ajax({ 
    type: 'POST', 
    url: url, 
    data: data, 
    success: success, 
    dataType: dataType, 
    async:false 
}); 
+0

http://stackoverflow.com/questions/5528852/ajax-sync-and-async-difference –

+1

它會工作,如果它是同步的,但它是一個糟糕的用戶體驗。 – icktoofay

+0

另一種方法是你應該重建你的代碼。並使用完成的功能ajax –

0

我想起了一個新的想法,請檢查一下。

/** 
* form submit 
*/ 
$('#form1').on('submit', function() { 
    if (checkExistence()) { 
     return false; 
    } 
}); 

/** 
* check existence in db 
* @returns {Boolean} 
*/ 
function checkExistence() { 
    var txtItemCode = $('#txtItemCode').val(); 
    var result = true; 
    $.post("http://localhost/test.php", { 
     txtItemCode: txtItemCode, 
    }, function(data, status) { 
     //alert("Data: " + data + "\nStatus: " + status); 

     if (data == 'OK') { 
      $('#status').html(data); 
      result = true; 
     } else { 
      $('#txtItemCode').val('').focus(); 
      $('#status').html("Code is already existing, please provide another one:)") 
      result = false; 
     } 
    }); 

    return result; 
} 

注意:您可以交換結果的值並檢查。

+1

這不行。由於Ajax是異步的,'checkExistence'將始終返回'true'。 –

+0

是的,你是很好的。然後可以使用http://malsup.com/jquery/form/表單提交方法,而不是正式表單提交。 –

+0

這不行,你的結果沒問題,但我需要提交表單數據。結果來到#status,但表單沒有提交。 – sam