等待 Ajax 完成执行其他功能

Question

我正在使用 Ajax 更新页面中的一些值。 然后，完成后我需要使用该值执行其他功能。

我将一个函数一个接一个地放置，但即使这样，第二个函数也不会等待 Ajax 完成。

$(document).ready(function(){
    $(".data").blur(function(){
        var id = $(this).attr('id');
        var value = $(this).html();
        var ad = id.split(';');

        Update(valor, id);
        Function2(ad[1]);


    });
});


function Update(value, id){
    if (window.XMLHttpRequest) {
           // code for IE7+, Firefox, Chrome, Opera, Safari
           xmlhttp=new XMLHttpRequest();
         } else { // code for IE6, IE5
           xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
         }
         xmlhttp.onreadystatechange=function() {
           if (xmlhttp.readyState==4 && xmlhttp.status==200) {
             document.getElementById("div_table").innerHTML=xmlhttp.responseText;
           }
         }
        xmlhttp.open("GET","update.php?value="+value+"&id="+id,true);
        xmlhttp.send();

}


function Function2(ad){
    var name_1 = $("#name_1").html(); //This part is updated inside a <span> by the Ajax function
    $('#'+ad).html(name_1);  
}

Answer 1

使用 jQuery Ajax 实际上非常简单。

$.ajax({
    url:"data/retrieve",
    success:function(result){
       //call your function
       Function2(result);
 }});

在此处查看 jQuery Ajax 文档： http : //api.jquery.com/jquery.ajax/

编辑：既然您使用 GET 作为请求类型，为什么不使用 jQuery.get？ 在这里，您可以使用此代码。 简单干净。

另外，如果它对您有用，请不要忘记将其标记为答案。 我们不想在 StackOverflow 上出现没有答案的问题，对吗？

$(document).ready(function(){
    $(".data").blur(function(){
        var id = $(this).attr('id');
        var value = $(this).html();
        var ad = id.split(';');

        Update(value, id); 
    });
});


function Update(value, id){
    $.get("update.php", {value: value, id: id}, function (data) {
         //call your function
         Function2(data);
    });
}


function Function2(ad){
    var name_1 = $("#name_1").html(); //This part is updated inside a <span> by the Ajax function
    $('#'+ad).html(name_1);  
}

Answer 2

您必须在处理程序function2内调用function2 ，即在您分配给onreadystatechange 。

此外，我建议使用 jQuery 来进行 ajax 调用，因为它的 API 更简单且跨浏览器。 有关一些示例，请参阅jQuery.ajax()的文档： http : //api.jquery.com/jquery.ajax/

Answer 3

我通常使用的最佳解决方案是带有 return 语句的 ajax 函数

        function ajax_func(value,id)
        {
            if (window.XMLHttpRequest)
                AJAX=new XMLHttpRequest(); 
            else
                AJAX=new ActiveXObject("Microsoft.XMLHTTP");
            if (AJAX)
            {
                AJAX.open("GETT", "update.php", false);
                AJAX.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                AJAX.send("value="+value+"&id="+id);
                return AJAX.responseText;                                         
            } 
            else
                return null;
        } 

您需要做的就是获取结果并执行您的其他功能

var Result = ajax_func("value","id");
new_func();