如何在jQuery中实现按钮点击函数执行完毕后调用func2函数？现有方法导致页面加载时触发按钮点击事件

先帮你拆解下当前代码的核心问题：

• 当你写$("#btn-click").click()却不带回调函数参数时，这是主动触发按钮的点击事件，而不是监听点击状态，所以页面一加载就会自动执行按钮的点击逻辑，这就是你遇到的页面加载时触发点击的原因。
• 另外，$.when()需要接收Deferred/Promise类型的对象来跟踪异步状态，但$("#btn-click").click()返回的是jQuery元素对象，不是Promise，所以done()的逻辑也不会按你预期的在点击操作完成后执行。

接下来根据你的需求，分两种场景给出解决办法：

场景1：按钮点击的操作都是同步的 #

如果你的点击回调里都是同步代码（没有AJAX、动画这类耗时的异步操作），最简单的方式就是直接在点击回调的末尾调用func2()：

$("#btn-click").click(function(){
    // 这里执行你的所有同步操作
    console.log("点击操作执行中");
    // 所有操作完成后直接调用func2
    func2();
});

function func2() {
    console.log("func2执行");
}

场景2：按钮点击的操作包含异步逻辑 #

如果你的点击回调里有异步操作（比如AJAX请求、jQuery动画），就需要用Promise来跟踪异步操作的完成状态，确保所有异步任务结束后再调用func2()：

比如包含单个AJAX请求的例子：

$("#btn-click").click(function(){
    // 创建Deferred对象跟踪异步状态
    const taskDeferred = $.Deferred();
    
    // 模拟异步AJAX操作
    $.ajax({
        url: "/your-api-endpoint",
        method: "GET"
    }).done(function(response) {
        // 处理AJAX返回结果
        console.log("AJAX请求完成");
        // 标记异步任务完成
        taskDeferred.resolve();
    }).fail(function() {
        // 若异步任务失败，可按需标记状态或处理错误
        taskDeferred.reject();
    });

    // 异步任务完成后调用func2
    taskDeferred.done(function() {
        func2();
    });
});

function func2() {
    console.log("func2执行");
}

如果有多个异步操作，还可以用$.when()合并多个Promise，等待所有任务完成后再执行：

$("#btn-click").click(function(){
    // 多个异步任务，比如两个AJAX请求
    const ajaxTask1 = $.ajax({ url: "/api-task-1" });
    const ajaxTask2 = $.ajax({ url: "/api-task-2" });

    // 所有异步任务完成后调用func2
    $.when(ajaxTask1, ajaxTask2).done(function() {
        func2();
    });
});

function func2() {
    console.log("func2执行");
}

总结一下：你之前的写法混淆了click()方法的两个用途（绑定事件监听 vs 主动触发事件），还错误地将jQuery对象传给了$.when()。根据操作是同步还是异步选择对应的写法，就能实现“按钮点击函数执行完所有操作后调用func2”的需求啦。

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