Question

我试图弄清楚如何传递我的回调附加参数。到目前为止，我有以下代码。

$("#refine_mp_type").change(function(){
    var mp_type = $(this).val();
    var country_id = $('#refine_country').val();
    var dropdown = $('#refine_grade').find('select');
    getMPTypeGrades(country_id, mp_type, populateGradesDropdown);
});

function getMPTypeGrades(country_id, mp_type, callback){
    display_wait_dialog ("Please Wait", "Loading grades...");
    $.ajax(
    {
        //do ajax
    })
    .done(function(data){
        callback(data);
    })
    .fail(//do something)
    .always(//do something);
}

populateGradesDropdown(data){
    //populate the dropdown with the returned data
}

到目前为止，我对如何实现这一点的想法是：

我可以将下拉变量设置为全局范围并以这种方式访问它（将污染全局范围）。
我可以将dropdown元素传递给getMPTypeGrades函数，然后将其传递给回调函数。（我想让getMPTypeGrades尽可能通用。我不知道我是否总是传递一个接受JQuery元素的回调。）

将JQuery元素和Ajax响应作为回调参数传递的最佳方法是什么？

Answer 1

您可以将下拉列表绑定到回调函数：

$("#refine_mp_type").change(function(){
    var mp_type = $(this).val();
    var country_id = $('#refine_country').val();
    var dropdown = $('#refine_grade').find('select');
    getMPTypeGrades(country_id, mp_type, populateGradesDropdown.bind(null, dropdown));
});

然后

populateGradesDropdown(dropdown, data){
    //populate the dropdown with the returned data
}

Answer 2

尝试使用jQuery Deferred和jQuery when。基本上，您创建一个具有挂起状态的延迟对象，并将其返回给调用者。 jQuery when仅在已解析或拒绝延迟对象时执行回调函数。完成ajax请求后，系统会调用.resolve或.reject。这将触发调用者的回调方法。

我还没有测试过这段代码，但它应该或多或少地运行。

$("#refine_mp_type").change(function() {
    var mp_type = $(this).val();
    var country_id = $('#refine_country').val();
    var dropdown = $('#refine_grade').find('select');
    $.when(getMPTypeGrades(country_id, mp_type)).then(function(result) {
       //populate dropdown
    });
});

function getMPTypeGrades(country_id, mp_type) {
    var def = $.Deferred();   
    display_wait_dialog ("Please Wait", "Loading grades...");
    $.ajax(
    {
        //do ajax
    })
    .done(function(data) {
        def.resolve(data);
    })
    .fail(function(err) {
        def.reject(err);
    })
    .always(function() {
        hide_wait_dialog();
    });
    return def;
}

Answer 3

您应该只在getMPTypeGrades中返回延迟的ajax对象，而不是传递回调（可以创建回调的“金字塔”代码）。然后，您可以在更改处理程序中使用标准.done()/.then()函数：

$("#refine_mp_type").change(function(){
    var mp_type = $(this).val();
    var country_id = $('#refine_country').val();
    var dropdown = $('#refine_grade').find('select');
    getMPTypeGrades(country_id, mp_type).then(populateGradesDropdown);
});

function getMPTypeGrades(country_id, mp_type){
    display_wait_dialog ("Please Wait", "Loading grades...");
    return $.ajax(
    {
        //do ajax
    })
    .fail(//do something)
    .always(//do something);
}

populateGradesDropdown(data){
    //populate the dropdown with the returned data
}

Answer 4

您可以在回调函数体中引用原始下拉变量：

var dropdown = /*whatever*/;
getMPTypeGrades(country_id, mp_type, function(data) {
    populateGradesDropdown(data, dropdown);
});

$.ajax({
}).done(function(data){
    callback(data);
})

function populateGradesDropdown(data, dropdown){
    alert("data=" + data);
    alert("dropdown=" + dropdown);
}

将参数传递给回调

4 个答案: