javascript - Jquery 不是选择器不适用于子元素？

Question

$(document).on('click', '#ul li:not(.info)', function(){

    alert();
});

我的html是这样的

<ul id="ul">
<li></li>
<li><a href="#" class="info"></li>
</ul>

为什么当我点击.info时它仍然触发？

Answer 1

因为你的 HTML 定义了 .info <a> 上的类(class)后代而不是 <li>本身，而您的选择器表示 :not(.info)这意味着<li>没有 .info类。

试试这个:

$(document).on('click', '#ul li:not(:has(.info))', function(){
    alert();
});

或者，您可以简单地移动您的 .info类到 <li>本身:

<li class="info"><a href="#"></li>

请参阅 jQuery 的 has和 Fiddle