使用jquery / javascript防止第一次警报

Question

我想在点击事件上附加功能。 我的函数附加了它，但它也正在调用它。 我不明白为什么。 演示

$(function () {
    $('a').click(function () {
        $(document).bind('click', perform)
    })
})
function perform() {
    alert(0)
}

Answer 1

如果事件“冒泡”，同时触发a元素及其父元素，则可以强制jquery停止触发此元素上方的其他事件，如下所示：

http://jsfiddle.net/4yHC4/2/

$(function () {
    $('a').click(function (e) {
        $(document).bind('click', perform)
        e.stopPropagation();
    })
})

function perform() {
    alert(0)
}

Answer 2

由于click事件传播并鼓舞了DOM。 将您的代码更改为：

$(function () {
    $('a').click(function (e) {
        e.stopPropagation();
        $(document).on('click', perform)
    })
})

jsFiddle示例

由于您的链接是body元素的后代，因此单击它实际上会在DOM上移动并触发绑定到其祖先元素的所有click事件。 您可以通过在链接上使用.stopPropagation()来停止此操作。

Answer 3

在点击事件之前尝试此操作

          $(document).unbind("click");
          $(document).bind("click" , perform);

Answer 4

发生的事情称为event propagation 。 在a元素上触发click事件时， document将被绑定，然后click事件会传播到文档并运行您的函数。

要阻止这种情况发生，请运行event.stopPropagation(); 。 这样做是告诉浏览器：不要让此click事件传播出去。

您的示例代码具有event.stopPropagation(); ：

function perform() {
    alert(0);
}

$(function () { 
    $('a').click(function (event) {
        event.stopPropagation();

        $(document).bind('click',perform);
    });
});

这是一个很好的链接： Java事件传播