jQuery .click 不断添加事件，而不是替换它

Question

我有the following code block :

function testJQueryClick(){
     $('#button2').click(function(){ alert ('Debug'); return false; });       
}

当我调用该函数一次(然后单击按钮 2)时，我收到了预期的警报。当我第二次调用相同的函数然后单击按钮 2 时，我收到两个警报，第三次收到三个警报，等等。jQuery 似乎每次都会附加 .click 事件，而不是替换它。

我希望每次调用 .click 处理程序时都会替换它。我在 jQuery documentation 中找不到任何内容要么确认这是预期的行为，要么不是。

Answer 1

您需要首先调用 off 来删除旧的事件监听器:

function testJQueryClick () {
    $('#button2').off('click').on('click', function () {
        alert ('Debug');

        return false;
    });      
}

See it in the Pen in action .