Question

我正在调用一个函数来使用jQuery.post刷新当前页面的一部分 - 然后在该函数完成之后我需要执行另一个更新该页面上的Google Map的函数，使用从中写出的更新的HTML $ .post

我无法嵌套函数，因为DoGoogleMap（）不能在RefreshSubdivisionList（）函数的范围内工作。

在调用DoGoogleMap（）函数之前，如何让它等待$ .post完成将更新的HTML写入页面？

function RefreshSubdivisionList() {

    var formActionScript = jQuery("#RefreshSubdivisionForm").attr('action');

    jQuery.post(formActionScript, jQuery("#RefreshSubdivisionForm").serialize()).done(function(data) {

        jQuery(".subdivision-list").html(data).show();

    }, 'text');

    return true;

}


jQuery("#RefreshSubdivisionForm").submit(function(event) {

    event.preventDefault();
    jQuery.when( RefreshSubdivisionList() ).done(function(){
        jQuery('#map_canvas').gmap('destroy');
        DoGoogleMap();
    });

    return false;

});

Answer 1

您可以将DoGoogleMap();直接放在done的{{1}}回调中，不是吗？

然后它会在帖子完成后加载你的地图。

Answer 2

jQuery.when() 提供了处理同步多个异步调用的情况的机制。看看：

function ajax1 {
    return $.ajax("/page1/action", {});
}

function ajax2 {
    return $.ajax("/page2/action", {});
}

var promise = $.when(ajax1, ajax2);

promise.done(function (resp1, resp2) {
  // The parameters resp1 and resp2 are the responses 
  // of their respective ajax1 and ajax2 calls.
  // Each parameter is an array that contains the ajax response
  // with the following signature:
  // [data, statusText, jqXHR]
  // See: http://api.jquery.com/jquery.ajax/#jqXHR

  // suppose the data response for ajax1 is: "Hello"
  // suppose the data response for ajax2 is: "world"
  var data = resp1[0] + " " + resp2[0];

  if ((/hello\sworld/i).test(data)) {
    console.info("Promises rules!");
  }
});

在上一个示例中，我们处理成功响应，但我们可以采用相同的方式处理失败响应。

jqXHR返回的jQuery.ajax()对象实施承诺界面，为其提供 Promise <的所有属性，方法和行为/ strong>（有关详细信息，请参阅Deferred object）

其他方法是创建deferred个对象，并使用预期结果解析每个延迟对象，最后统一已解析的响应：

var d1 = $.Deferred(); var d2 = $.Deferred(); $.when(d1, d2).done(function (resp1, resp2) { console.log(resp1); // "Fish" console.log(resp2); // "Pizza" }); d1.resolve("Fish"); d2.resolve("Pizza");

Answer 3

要使这项工作看起来你需要做的就是从RefreshSubdivisionList方法返回jqXHR对象。

jQuery为post deffered接口提供XHR请求，这是when方法用于确定请求状态的方法。如果已完成或失败等，

function RefreshSubdivisionList() {
    var formActionScript = jQuery("#RefreshSubdivisionForm").attr('action');

    var postObj = jQuery.post(formActionScript, jQuery("#RefreshSubdivisionForm").serialize());

    postObj.done(function(data) {
        jQuery(".subdivision-list").html(data).show();
    }, 'text');

    return postObj;
}


jQuery("#RefreshSubdivisionForm").submit(function(event) {
    event.preventDefault();
    jQuery.when( RefreshSubdivisionList() ).done(function(){
        jQuery('#map_canvas').gmap('destroy');
        DoGoogleMap();
    });

    return false;

});

使jQuery等待$ .post完成更新页面

3 个答案: