Question

请考虑以下代码：

function searchText() {
    if($('#searchtext').val() == null || $('#searchtext').val().trim() == '') {
         alert('must provide a text to search for');
     return false;
    }

    urllink='http://search.twitter.com/search.json?q=' + escape($('#searchtext').val().trim()) + '&callback=?';
    $('#results').html(urllink);

    $.getJSON(urllink,function(data) {
         var resultT = {};
         $('#results').html(data.results[0].profile_image_url);

         return data.results;
    });
}

$('#gosearch').click(function() {
    var data = searchText();
    if(data == null)
         alert('null');

    return false;
});

我在return data.results searchText()的萤火虫中有一个断点。但似乎searchText已被执行，但我并没有停留在我的突破点。它反而检查数据null，并执行alert('null')。然后它会在searchText内的断点处停止。

为什么会这样？我不能在事件中执行函数并等待它们完成，然后再转到代码中的下一行吗？

感谢

Answer 1

您没有意识到AJAX是 A 同步。因此，当searchText()返回时，ajax请求尚未完成。您需要传递回调并执行该回调而不是执行return data.results;。

以下是一个例子：

function searchText(callback) {
    if ($('#searchtext').val() == null || $('#searchtext').val().trim() == '') {
        alert('must provide a text to search for');
        return false;
    }

    urllink = 'http://search.twitter.com/search.json?q=' + escape($('#searchtext').val().trim()) + '&callback=?';
    $('#results').html(urllink);

    $.getJSON(urllink, function (data) {
        var resultT = {};
        $('#results').html(data.results[0].profile_image_url);

        callback(data.results);
    });
}

$('#gosearch').click(function(e) {
    e.preventDefault();
    searchText(function(data) {
        if (data == null) alert('null');
        // do something with your data
    });
});

Answer 2

您正在从urllink异步获取数据，返回data.result所在的函数是一个回调函数，当对url的调用完成时将调用该函数。

后续代码不会等待异步调用完成。

jquery执行顺序

2 个答案: