要素に兄弟がある場合、何かを行う方法

Question

私は左のナビゲーションとして並べ替えられていないリストを持っています。リストアイテムのほとんどは、それらに関連付けられたサブメニューとして別の順序付けられていないリストを持っています。ただし、リンクのいくつかにはサブメニューがありません。サブメニューを持つリンクのデフォルトのクリック動作を無効にして、サブメニューのアニメーションを開くことができます。サブメニューのないリンクでは、リンクをクリック可能にする必要があります。 私はこれをしなければならないのjavascriptは次のとおりです。

$(function(){ 
    if($("#leftNav ul:first > li > a").siblings().size() > 0){ 
     $("#leftNav ul:first > li > a").click(function(e){ 
      e.preventDefault(); 
     }); 
    } 

問題は、これはすべてのリンク、兄弟とのものだけでなく、デフォルトのクリック動作を無効にしていることです。 左ナビゲーションのためのHTMLは、それが兄弟として<ul>を持っているので、リンク1で除去する必要があるであろう、この

<div id="leftNav"> 
    <ul> 
     <li> 
      <a href="#">Link 1</a> 
      <ul> 
       <li><a href="#">Submenu Link 1</a></li> 
       <li><a href="#">Submenu Link 2</a></li> 
       <li><a href="#">Submenu Link 3</a></li> 
      </ul> 
     </li> 
     <li><a href="#">Link 2</a></li> 
    </ul> 
</div> 

ので、クリックの動作のように見えます。リンク2には兄弟はありませんので、そのまま残すべきです。それを行うには

Answer 1

一つの方法は、子孫ulを持っているそれらのliの要素を見つけることであり、そのliでaを見つけ、それらをターゲット：

$('#leftNav li:has("ul")').find('a').each(
    function(){ 
     $(this).click(
      function(){ 
       alert("No clicking here"); 
       return false; 
      }); 
    }); 

JS Fiddle demoを。

---

改訂jQueryを追加するように編集：

$('#leftNav li:has("ul")').find('a').each(
    function(){ 
     $(this).click(
      function(){ 
       alert("No clicking here"); 
       return false; 
      }); 
    }); 
$('#leftNav li:has("ul")').hover(
    function(){ 
     $(this).find('ul').slideDown(); 
    }, 
    function(){ 
     $(this).find('ul').slideUp(); 
    }); 

Slightly more useful JS Fiddle demoを。

Answer 2

<script type="text/javascript"> 
    $(function() { 
     $("#leftNav ul:first > li > a").each(function (a, b) { 
      var t = $(b); 
      //alert(t.siblings().size()); 
      if (t.siblings().size() > 0) { 
       t.click(function (e) { 
        e.preventDefault(); 
       }); 
      } 
     }); 
    }); 
</script> 

Answer 3

最も簡単な方法：

$("#leftNav ul:first > li > a").not(":only-child").click(function(e){ 
     e.preventDefault(); 
}); 

Answer 4

私がコメントする十分に高い評価スコアを持っていますが、ちょうどチャックの答えは（FirefoxでEXCEPT？）私のために完全に働いたことを言いたかっはありません。私のメニューはまた、あなたがクリックしたものを開く前に、他の開いているメニューを隠す - ここで私が使用したコードは次のとおりです。

jQuery(document).ready(function($) { 
    $('ul.menu li ul.sub-menu').hide(); //Hide children by default 

    $("ul.menu:first > li > a").not(":only-child").click(function(){ 
      event.preventDefault(); 
      $(this).parent().siblings().children('ul.menu li ul.sub-menu').css('display','none'); 
      $(this).siblings('.sub-menu').slideToggle(800); 
     }); 
});