javascript - jQuery回调函数累积

Question

我为自定义确认框编写了一些代码，该确认框在按下确认按钮(是按钮)时调用一个函数并将另一个函数作为参数传递，然后我将其绑定(bind)到 2 个不同的按钮点击，并使用不同的函数作为参数。例如:

$('#button1').click(function() {
    callFunction(function() { alert("test"); });
});
$('#button2').click(function() {
    callFunction(function() { alert("test2"); });
});

function callFunction(callback) {
    //code to display custom confirm box

    console.log(callback);

    $('.confirm-box .yes-button').click(function() {
        callback();
    });
}

一切都按预期发生，确认框出现，点击确认按钮时，我执行了一个回调函数，它会提示“test”(或“test2”，具体取决于调用确认框的按钮)。当我单击发送警报“测试”的函数的 button1，然后我没有确认取消它(没有按预期发生任何事情)，然后单击将警报(“test2”)作为回调函数传递的 button2 时，问题就出现了。现在，一旦我按下是按钮而不是仅提醒“test2”，我就会同时收到“test2”和“test”警报，即使我写的那个 console.log 只记录在那个按钮 2 时提醒“test2”的函数点击。这些回调函数似乎堆叠在某个地方，但我不明白在哪里以及为什么。

Answer 1

.click() 函数可以向一个元素添加多个处理程序，我认为这就是这里发生的情况。试试这个:

// ...
$('.confirm-box .yes-button').unbind('click').click(function() {
    callback();
});

这会在应用新的点击处理程序之前删除所有以前的点击处理程序。