使用jquery触发ul标签单击事件

Fire ul tag click event not li with jquery

本文关键字:单击 事件 标签 ul jquery 触发 使用      更新时间:2023-09-26

如何影响点击事件只有ul标签不是所有的jQuery?

<!-- HTML -->
<ul class="wrap">
    <li>test1</li>
    <li>test2</li>
    <li>test3</li>
</ul>

我试过这样的jquery。但是这行不通。

//Javascript
jQuery("ul.wrap").not(jQuery("ul > li")).click(function(){
      //fire only ul
});

我们该怎么做?

您可以简单地使用以下代码:

jQuery('.wrap').click(function (event) {    
    if ( !$(event.target).is( "li" ) ) {
        console.log('ul clicked!');
    } 
});

您可以在这里看到一个显示ul和li的背景颜色的示例:http://jsfiddle.net/S67Uu/2/

事件在DOM中"冒泡"到它们的父元素。您需要做的是将事件附加到ul,并将另一个事件附加到使用stopPropagation()的子li元素上:

jQuery("ul.wrap")
    .on('click', function(){
        // do something...
    })
    .on('click', 'li', function(e) {
        e.stopPropagation();
    });