jquery - 我怎样才能让我的 jQuery 'Click' 函数只为直接 li 运行，而不是子 li 的

Question

我有:

$('#accordion > li).click(function () {

但是如果 #accordion li ol li 也被单击，它就会运行。

这是 html 标记:

<ul id="accordion"> 
   <li id="test1">
       <a href="#">Test</a>
       <ol>
            <li>
            <a href="#">test</a>     
            </li>
       </ol>
    </li>
</ul>

Answer 1

问题是后代元素上的事件会向上冒泡到祖先元素。通过检查原始元素 (event.target) 的第一个祖先 li 是否是正在处理该函数的元素来停止此操作:

$('#accordion > li').click(function (event) {
    if ($(event.target).closest('li').is(this)) {
        // it's the right one
    }
});

查看

• event.target
• closest
• is