jQuery - 不允许click事件与父元素有什么子元素？

Question

我有一个像这样的HTML代码：

<div class="pagination">
    <ul>
        <li class="prev"><span>&#8592;</span></li>
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
        <li class="next"><a href="javascript::void(0)">&#8594;</a></li> 
    </ul>
</div><!-- .pagination -->

当我为li标签添加点击事件时，我想点击 li 标记没有span 子元素。这意味着如果我点击< / strong> 它，什么都不做但其他我可以点击做某事。我该怎么办？

Answer 1

您可以组合:not()和:has()伪选择器来执行此操作：

$('.pagination ul li:not(:has(span))').on('click', function() {
    // do stuff
});

FIDDLE

这样做似乎更容易：

$('.pagination ul li a').on('click', function(e) {
    e.preventDefault();
    // do stuff
});