jQuery只有顶级列表项

Question

我正在尝试阻止菜单项的默认点击，但仍然可以点击子菜单项。

我的菜单结构：

<li class="menu-item"><a href="">Publications</a>
<ul class="sub-menu">
<li class="menu-item"><a href="">Books</a></li>
<li class="noclick menu-item "><a href="">Articles</a>
<ul class="sub-menu">
    <li class="menu-item"><a href="">Historical-Phenomenological</a></li>
    <li class="menu-item"><a href="">Contemporary Theology</a></li>
    <li class="menu-item"><a href="">Communal Affairs</a></li>
    <li class="menu-item"><a href="">Translations</a></li>
</ul>
</li>
</ul>
</li>

我正在使用的jQuery禁用了文章及其下的所有链接的点击。我只是想禁用点击文章的链接。

jQuery(function($) {
    $('.noclick a').click(function(e) {
        e.preventDefault();
    });
});

Answer 1

您定位noclick中的所有主要元素，而不是使用child selector

仅定位noclick的子元素

jQuery(function($) {
    $('.noclick > a').click(function(e) {
        e.preventDefault();
    });
});