jQuery点击事件中执行ajax请求后如何向指定函数传递参数

你的代码存在两个核心问题，修复后即可正常传参执行：

• 问题1：函数名拼写错误，你在调用时写的funct2多了1个t，和你定义的func2名称不匹配，导致直接调用失败
• 问题2：func1和func2内部返回的Deferred对象没有手动触发resolve()，$.when会一直等待异步任务完成信号，永远不会执行后续的done回调
• 传参逻辑本身没有问题：param1ToBePassed和param2ToBePassed是buttonClick的局部变量，在内部回调作用域中可以直接访问，直接作为入参传给func2即可

提示：如果func1或func2内部包含异步逻辑（比如定时器、其他接口请求），需要把deferred.resolve()写在异步逻辑的回调里，确保逻辑真的执行完成后再通知任务结束。

修正后的完整代码 #

function buttonClick(e){
    var param1ToBePassed = 1;
    var param2ToBePassed = 2;
    $.when(func1())
    .done(function(){
        // 并行执行ajax请求和func2
        $.when(
            $.ajax({
                // 此处补充你的ajax配置
                url: 'your/api/path',
                method: 'GET'
            }),
            // 正确拼写函数名，直接传参即可
            func2(param1ToBePassed, param2ToBePassed)
        )
        .done(()=>{console.log('ajax and func2 calls finished');})
    })
} 
var func1 = function(){
    var deferred = new $.Deferred(); 
    /* 此处执行func1的业务逻辑 */ 
    // 逻辑执行完成后主动触发resolve，通知$.when任务完成
    deferred.resolve();
    return deferred;
}
var func2 = function(param1, param2){
    var deferred = new $.Deferred(); 
    /* 此处用传入的param1和param2执行业务逻辑 */
    console.log('func2拿到的参数：', param1, param2);
    // 逻辑执行完成后主动触发resolve
    deferred.resolve();
    return deferred;
}

可选执行顺序调整 #

如果你需要的是先执行ajax请求，拿到返回结果后再调用func2，而非并行执行两个任务，可以调整写法如下：

.done(function(){
    $.ajax({
        // ajax配置
    })
    .done(function(ajaxRes){
        // 也可以把ajax返回结果作为参数传给func2
        func2(param1ToBePassed, param2ToBePassed)
        .done(()=>{
            console.log('ajax先执行完成，func2也执行完成');
        })
    })
})

内容的提问来源于stack exchange，提问作者SoftwareDveloper