Question

我使用html（）：

在div中使用类“info”创建了一个新元素

$(".info").html(
    $elementsString      // which places a bunch of form elements in there
);

我点击了一个事件：

$('.info').on('click', 'input', function(event){
    alert('ey');
    event.preventDefault();
});

但事件被解雇了两次。谁知道为什么？

的jsfiddle

是的，here是JSFiddle。

Answer 1

我认为您应该拨打event.stopPropagation()而不是event.preventDefault();

$('.info').on('click', 'input', function(event) {
    alert('ey');
    event.stopPropagation();
});

Answer 2

如果event.stopPropagation（）不起作用，您可以比较target和currentTarget，以确保实际单击正确的元素。非常喜欢这样：

$('.info').on('click', 'input', function(event){
   if (event.target == event.currentTarget) {
      event.preventDefault();
      // Do stuff here...
   }
});

希望这有帮助

Answer 3

尽管stopPropagation()有效并且我接受了它作为答案，但问题的根源实际上是造成了不好的标记。这是一个丛林，因为不同的脚本和PHP通过一切编写，但在清理JSFiddle的所有内容（现在插入到问题的底部）后，很明显我有嵌套的.info元素。

底线：嵌套了.info个元素，因此触发了这两个事件。我通过更改其中一个元素的类名解决了这个问题。

jQuery事件在新元素上触发了两次

3 个答案: