Question

我有以下HMTL代码：

<li>
    <img .../>
    <img .../>
    <img .../>
</li>

我想为每个元素注册不同的函数（一个用于列表项，另外三个用于图像）。我在所有注册点击事件，但是当我点击图像时，li函数会触发。

li.addEventListener("click",open,false);
img1.addEventListener("click",edit,false);
img2.addEventListener("click",delete,false);
img3.addEventListener("click",add,false);

我用谷歌搜索当你设置为真的最后一个参数但仍然没有运气时会发生什么。

感谢您的帮助。

Answer 1

定义函数时，停止事件传播，如下所示：

function open(e) {
   e.stopPropagation();
}

function edit(e) {
   e.stopPropagation()
}

依旧......

Answer 2

扩展designcise的答案......你需要使用e.stopPropagation（）来阻止事件冒泡

$('li img').on('click',function(e){
    e.stopPropagation();
    alert('img clicked');
});

这里有一个jsfiddle http://jsfiddle.net/hbGRS/

一个元素内的多个单击事件

2 个答案: