JavaScript返回不正確的值

Question

我有一個函數，該函數從AJAX調用返回數據，以確定用戶是否還有剩余的信用，然后相應地顯示數據。 奇怪的是，該函數未返回預期結果。 這是代碼：

function setupBuildInputs() {
    noCreditsError = '<div class="alert alert-danger">You have no build credits remaining, please contact a representative to purchase more.</div>';

    if ( $('#newWebsiteBuildForm #user_id').length ) { 
        $('#newWebsiteBuildForm #user_id').change(function () {
            userID = $(this).val();
            jQuery.get(SITE_URL + '/ajax.php?action=getBuildCreditsRemaining&id=' + userID, function(numOfCredits) {
                if ( numOfCredits > 0 ) {
                    // Get latest website URL and show it on the page
                    $('#websiteURLHolder').html('Updating...');
                    jQuery.get(SITE_URL + '/ajax.php?action=getNextWebsiteUsername&id=' + userID, function(data) {
                        $('#websiteURLHolder').html(data + '.checkoutyournewsite.com');
                    });
                } else {
                    $('#quickBuildTagsHolder').html( noCreditsError );
                }
            });
        }); 
    }
    $('#newWebsiteBuildForm #template').change(function () {
        // Show the build form items
        numOfRemainingCredits = checkBuildCredits( $('#newWebsiteBuildForm #user_id').val() );
        alert(numOfRemainingCredits);

        if ( numOfRemainingCredits > 0 ) {
            $('#quickBuildTagsHolder').html('Updating...');
            jQuery.get(SITE_URL + '/ajax.php?action=returnQuickBuildTags&template=' + $(this).val(), function(data) {
                $('#quickBuildTagsHolder').html(data);
            });
        } else {
            $('#quickBuildTagsHolder').html( noCreditsError );
        }
    });
}
function checkBuildCredits( userID ) {
    buildCredits = 0;

    jQuery.get(SITE_URL + '/ajax.php?action=getBuildCreditsRemaining&id=' + userID, function(data) {
        buildCredits = data;
    });

    return buildCredits;
}

setupBuildInputs();

使用firebug，我可以看到對ajax.php？action = getBuildCreditsRemaining的調用從頁面中提取了正確的ID，並返回了正確的值（9999）。 為了進一步調試，我在第二個更改事件處理程序上添加了警報，結果返回為0而不是9999。

接下來，我添加了2個警報，甚至還添加了一個checkBuildCredits函數。 第一個驗證了ajax調用有效並且數據設置為9999。第二個奇怪地表明，在函數返回之前，buildCredits仍設置為0。

在setupBuildInputs函數中，第一個更改處理程序使用相同的ajax調用，並且工作正常，第二個使用該函數的更改處理程序當然會失敗，因為它沒有得到9999，而是看到0。

任何想法在這里發生了什么？

Answer 1

jquery.get默認是異步的。 因此，在獲取數據之前，該函數在您的函數checkBuildCredits返回0值

Answer 2

代替$.get()嘗試使用以下命令：

$.ajax({
    url: SITE_URL + '/ajax.php?action=getBuildCreditsRemaining&id=' + userID,
    success: function(data) {
        buildCredits = data;
    },
    asynch: false
});

在繼續執行腳本之前，這將等待ajax調用完成。

Answer 3

以此替換checkBuildCredits

function checkBuildCredits( userID, successFn ) {


jQuery.get(SITE_URL + '/ajax.php?action=getBuildCreditsRemaining&id=' + userID, function(data) {
    successFn(data);
});

}

然后，當您調用checkBuildCredits時，請像這樣進行操作

checkBuildCredits( $('#newWebsiteBuildForm #user_id').val(), function(numOfRemainingCredits )
{
 if ( numOfRemainingCredits > 0 ) {
        $('#quickBuildTagsHolder').html('Updating...');
        jQuery.get(SITE_URL + '/ajax.php?action=returnQuickBuildTags&template=' +   $(this).val(), function(data) {
            $('#quickBuildTagsHolder').html(data);
        });
    } else {
        $('#quickBuildTagsHolder').html( noCreditsError );
    }

});

正如其他人解釋的那樣，jquery.get是異步的。 並且根據您的設計，您將jquery.get視為同步調用。