为什么jQuery on()方法不适用于现有元素？

Question

3

我有一个id为#editor的div。在这个div中有一个class为.float-right的图片。我还动态地向#editor div添加了具有相同class的新图像。下面的jQuery代码适用于新添加的图像，但不适用于现有的图像。为什么？我需要两种方式都能使用。

HTML

<div id="#editor">
    <img src="img.jpg" class="float-right">
    <!--jQuery will select this image only if added after page load -->
</div>

jQuery

$('#editor').on('click', '.float-right', function() {
//Do stuff
});

我正在处理的草稿代码是http://jsfiddle.net/kthornbloom/9tdDa/（它是一个所见即所得的HTML5编辑器）。

- kthornbloom

哦，我没想到！如果你看到了，请告诉我。 - kthornbloom

1

你的选择器.img-wrap-left #btn-done表明你可能是。 - John Dvorak

啊，那更多是一个不必要的选择器的问题，而非有多个 ID 的问题。谢谢你发现了这个。 - kthornbloom

1

这些 ID 在您单击图像后显示，一次只能打开一个图像的“控件”。因此，它们一次只存在一个位置，但可以在编辑过程中在页面的不同位置使用。 - kthornbloom

1

不，选择器过于具体化了。我应该只写 "#btn-done" 而不是 ".img-wrap-left #btn-done"。 - kthornbloom

显示剩余3条评论

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Kevin B · Accepted Answer

你正在使用 #editor 的所有现有子元素上阻止所有点击事件。

$("#editor").children().click(function(){
    return false;
});

将它（在两个位置）移除，它就可以工作了。它不会影响新元素，因为它只针对现有的元素。