Question

<ul id="nav">
    <li><a href="#">Home</a></li>
    <li><a href="#">Discography</a>
        <ul>
            <li><a href="#">item</a></li>
            <li><a href="#">item</a></li>
            <li><a href="#">item</a></li>
            <li><a href="#">item</a></li>
        </ul>
    </li>
    <li><a href="#">Videography</a>
        <ul>
            <li><a href="#">item</a></li>
            <li><a href="#">item</a></li>
            <li><a href="#">item</a></li>
            <li><a href="#">item</a></li>
        </ul>
    </li>
    <li><a href="#">About</a></li>
</ul>

我想获取jquery选择器中具有子菜单的主链接。我不想抓住子菜单链接。我只想要有子菜单的主要链接。

我尝试了下面的选择器，但它给了我所有的主要链接（主页，唱片，录像，关于）。

$("#nav > li > a").click(function() {
    alert("click called");
});

相反，我只希望它在用户点击唱片和视频摄像时发出警告。

Answer 1

<强> jsFiddle demo

$("#nav li:has(ul) > a").click(function() {
    alert("click called");
});

P.S：上述内容甚至适用于更深层次的嵌套列表！

Answer 2

DEMO只需使用.has（＆＃39; ul＆＃39;）。长度......就像那样

$("#nav  li  a").click(function() {
   if($(this).parent().has('ul').length){
      alert("this has submenu");
    }
});

Answer 3

您需要查找是否存在任何ul元素......

$("#nav li").click(function() {
var subs = $('ul')
if($(this).find(subs).length !== 0){
  alert("Click called");
}
});

检查fiddle

修改

“li”及其所有子项在上面的代码中被选中，以下是如何修复

$("#nav li a").click(function() { var subs = $('ul') if($(this).parent().find(subs).length!==0){ alert("Click called"); } });

已编辑Fiddle

Answer 4

你也可以这样：

$( '#nav li a' ).click(function() {

    var submenu = $( this ).find( 'ul' ).length;
    if( submenu > 0 )
    {
        // Your Code Here
    }

});

仅定位在选择器中具有子菜单的链接

4 个答案: