如果LI元素是父元素且具有UL（子元素或子菜單），如何添加此跨度

我基本上想要添加箭頭（如果mousehover爲我的導航）。但是，兩個規則應適用：如果LI元素是父元素且具有UL（子元素或子菜單），如何添加此跨度

它是頂部的父（我已經解決，在代碼）
它必須有子元素（UL）子菜單等。（這是問題！）

我不能，不管我做什麼，只有在有條件的情況下才會顯示它是否先檢查它是否有孩子。現在這兩個包含兒童的鏈接，並沒有顯示箭頭..請幫助我。

我的代碼：

$("#menu ul").css({display: "none"}); // Opera Fix 
$("#menu li").hover(function(){ 
    if (($(this).parent().attr("id") == 'menu')) { 
    $(this).append('<span class="arrow"></span>'); 
    } 
    $(this).find('ul:first').css({visibility: "visible",display: "none"}).slideToggle(500); 
},function(){ 
    if ($(this).parent().attr("id") == 'menu') { 
    $('.arrow').remove(); 
    } 
    $(this).find('ul:first').css({visibility: "hidden"}); 
});

問題：如何添加& &有條件的，如果到this.parent（）ATTR（「ID」）==「菜單，檢查，如果李娜孩子/子UL。

我試過$（this）.next（）。（'ul'）沒有運氣！它仍然附加所有的項目與孩子，沒有。

需要您在此輸入。

來源

2010-11-06 Ahmad Fouad

你對多個元素有'id =「menu」嗎？ – 2010-11-06 00:34:49

您真的不應該需要if()聲明。只需在選擇器中作出要求li是#menu的孩子。

我假設#menu元素是排名前<ul>而你的.hide()是隱藏子級別<ul>元素。

沒有看到你的HTML，我不知道這是否是你所需要的東西，但不妨一試：

$("#menu > li:has(ul)").hover(function(){ 
    $(this).append('<span class="arrow"></span>') 
      .find('ul:first').css({visibility: "visible",display: "none"}).slideToggle(500); 
},function(){ 
    $(this).children('.arrow').remove() 
      .end().find('ul:first').css({visibility: "hidden"}); 
});

那麼這隻會火懸停如果<li>是#menu一個direct child ，如果它:has()後裔<ul>。

來源

2010-11-06 00:43:28 user113716

完美！像魅力:) – 2010-11-06 01:01:56

@Ahmad - 很高興它的工作。：O） – user113716 2010-11-06 01:05:12

if($(this).parent("#id")) { ... }應該工作，因爲父母（）只看直接父母。

if($(this).parent("#id").children("ul")) { ... }會當父母的ID被找到工作，它有一個直接子

另一種方式來做到這一點是：

function doToggle(element){ 
    element.children('ul').css({visibility:"visible", display:"none"}).slideToggle(500); 
} 
function doHide(element){ 
    element.children('ul').css({visibility:"hidden"}); 
} 
$("#menu li").hover(function(){ 
    doToggle($(this)); 
}, 
function(){ 
    doHide($(this)); 
}); 
$("#menu > li").hover(function(){ 
    $(this).append('<span class="arrow"></span>'); 
}, 
function(){ 
    $('.arrow').remove(); 
});

這樣，你不需要遍歷DOM 。

來源

2010-11-06 00:36:44 Scott

如果你要來檢查的li元素的父元素是否在懸停事件處理程序#menu，那麼你可能也只能與直系後裔選擇>選擇#menu的直系後裔。

假設ul子菜單元素是#menu > li元素的孩子（因爲在另一ul元素ul元素無效HTML），該代碼應工作：

$("#menu > li").hover(function(){ 
    var $this = $(this); 

    if ($this.children('ul').length) { 
     $this.append('<span class="arrow"></span>'); 
    } 

    $this.find('ul:first').hide().slideToggle(500); 
},function(){ 
    $('.arrow').remove(); 
    $(this).find('ul:first').hide(); 
});

此代碼還使用了hide()功能，而不是稍微凌亂css('display', 'none'

來源

2010-11-06 00:42:07

這也工作！非常好，謝謝！ – 2010-11-06 01:02:14

首先，當您將懸停事件綁定到#menu > li，而不是你必須檢查它是一個直接的孩子（即頂級項目）。然後繼續，並簡單地查詢第二個條件：

$('#menu > li').hover(function() { 
    if (!$(this).find('ul').length) return; 

    $(this).append('<span class="arrow"></span>'); 
    .... 
}, function() { 
    // Just try to remove it, jQuery won't operate on empty sets anyways 
    $('span.arrow', this).remove(); 
    ... 
});

在這裏，你去。

來源

2010-11-06 00:42:46 aefxx

如果LI元素是父元素且具有UL（子元素或子菜單），如何添加此跨度

回答

相關問題