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

Multiple click events inside one element

本文关键字:单击 事件 元素 一个      更新时间:2023-09-26

我有以下html代码:

<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);

我谷歌了一下当你把最后一个参数设置为true时会发生什么,但仍然没有运气。

谢谢你的帮助

当你定义你的函数时,停止事件的传播,像这样:

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

对designcise的回答进行扩展…您需要使用e.p stoppropagation()来阻止事件冒泡

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

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