Question

假设我的功能如下：

function load_form() {
    $( '.result' ).load( '/form.html', function() {
        console.log( 'form loaded.' );
    } );
}

这会通过ajax加载表单。（实际上，它根据所选的无线电加载不同的形式，然后在加载后在不同的元素上设置事件）

所以我写的代码的另一部分是：

load_form();

没问题！然后在其他地方我写了另一个load_form() ......再没问题。（基本上是通过表格添加数据时）

再往下，我需要加载表单，但之后做一些不同的事情:(例如，在我点击加载表单后，我需要用数据填充它）

load_form();
//afterwards I need it to run this function
populate_form();

我想我会将其链接如下：

function load_form() {
    return $( '.result' ).load( '/form.html', function() {
        console.log( 'form loaded.' );
    } );
}

$promise = load_form();
$.when( $promise ).done( populate_form );

......但这并不像我希望的那样有效。它不是运行console.log，而是运行populate_form（），而是运行populate_form（），然后运行console.log。（在这种情况下，这不是问题，但在实际代码中，顺序很重要）

我也尝试过：

$( document ).ajaxComplete( populate_form );

但是，这不起作用，因为它每次都运行，然后当我尝试取消它时如下：

$( document ).ajaxComplete( function() {
    populate_form();
    $(document).unbind( "ajaxComplete" );
});

那么任何想法如何在每个请求的基础上为完成的ajax调用添加特定的功能？

由于吉姆

Answer 1

您可以让load_form进行回调，并在加载完成后调用它。

function load_form(callback) {
    $( '.result' ).load( '/form.html', function() {
        console.log( 'form loaded.' );
        if(callback)
            callback();
    } );
}

load_form(populate_form);

这也允许您将参数传递给回调，如下所示：

user = {username : 'Jim Win'};
load_form(function() {
    populate_form(user);
});

Ajax链式完成事件（jQuery）

1 个答案: