传递包含参数的回调函数?

时间:2013-01-07 16:31:09

标签: javascript jquery ajax callback

我有以下代码..

function getGrades(grading_company) {

    if (grading_company == 'Not Specified') {

        // Remove grades box & show condition box
        showConditionBox();

    } else {

        // Set file to get results from..
        var loadUrl = "ajax_files/get_grades.php";

        // Set data string
        var dataString = 'gc_id=' + grading_company;

        // Set the callback function to run on success
        var callback = showGradesBox;

        // Run the AJAX request
        runAjax(loadUrl, dataString, callback);  

    }

}

function runAjax(loadUrl, dataString, callback) {

    jQuery.ajax({
        type: 'GET',
        url: loadUrl,
        data: dataString,
        dataType: 'html',
        error: ajaxError,
        success: function(response) {
            callback(response);
        }
    });    

}

编辑:以下是作为回调函数调用的函数:

function showGradesBox(response) {

    // Load data into grade field
    jQuery('#grade').html(response);

    // Hide condition fields
    jQuery('#condition').hide();
    jQuery('#condition_text').hide();

    // Show grade fields
    jQuery('#grade_wrapper').show();
    jQuery('#grade_text_wrapper').show();    

}

现在,如果我想将grading_company变量传递给回调函数作为参数,有没有办法在runAjax调用中将其添加为另一个参数?我试图让runAjax函数对其他用法保持开放,所以我不想传递任何额外的参数;但如果它可以以某种方式包含在回调中那么好。

2 个答案:

答案 0 :(得分:45)

将回调更改为匿名函数:

// Set the callback function to run on success
var callback = function () {
    showGradesBox(grading_company);
};

这允许您将参数传递给内部函数。

编辑:允许ajax响应:

// Set the callback function to run on success
var callback = function (response) {
    showGradesBox(grading_company, response);
};

答案 1 :(得分:2)

另一种可能性是执行dataString执行dataObject而不是将该对象传递给回调。像这样:

function getGrades(grading_company) {

    if (grading_company == 'Not Specified') {

        // Remove grades box & show condition box
        showConditionBox();

    } else {

        // Set file to get results from..
        var loadUrl = "ajax_files/get_grades.php";

        // Set data object
        var dataObject = {
            'gc_id' : grading_company
            /*to do multiples..
            'item1' : value1, 
            'item2' : value2, 
            'etc' : etc */
        }

        // Set the callback function to run on success
        var callback = showGradesBox;

        // Run the AJAX request
        runAjax(loadUrl, dataObject, callback);  

    }

}

function runAjax(loadUrl, dataObject, callback) {

    jQuery.ajax({
        type: 'GET',
        url: loadUrl,
        data: $.param(dataObject),
        dataType: 'html',
        error: ajaxError,
        success: function(response) {
            callback(response, dataObject);
        }
    });    

}

请注意添加$.param()

然后在回调函数中,您应该知道您追求的数据。如果function setGrades(resp, data) { ... }是回调,那么您可以访问setGrades

中的值
function setGrades(resp, data) {
   alert( data.gc_id);
}

修改

经过测试,我意识到$(dataObject).serialize()无效。所以我已更新为使用$.param()。有关详细信息,请参阅this SO post