javascript - インデックス配列をナビゲートするクリックで二重アラート

Question

サブメニューをクリックすると 2 つのアラートが表示されます。最初にポップアップで 1 が表示され、次に 2 番目のポップアップで 2 が表示されます。配列。配列内の次の項目だけのサブメニュー項目ではありませんか?

<ul id="menu">
   <li><a href="page1">Item 1</a></li>
   <li><a href="page2">Item 2</a> 
      <ul id="sub-menu">
           <li><a href="page3">Item 3</a></li>
      </ul>
   </li>
   <li><a href="page4">Item 4</a></li>
</ul>

Jクエリ:

jQuery (function($) {
  $("#menu .menu li").each(function (index) {
     var item = $(this);
     $("a", item).click(function (e) {
        e.preventDefault();
        alert(index);
     });
  });
});

Answer 1

を使わない方法event.stopPropagation()：

jQuery (function($) {
  $("#menu .menu li").each(function (index) {
    var item = $(this);
    $("> a", item).click(function (e) {
      e.preventDefault();
      alert(index);
    });
  });
});​

の直接の子に対してのみトリガーされliます。

これが実際の例です。

Answer 2

ああ、私はあなたが最も近い同封のulに相対的なインデックスが欲しいと思った: http://jsfiddle.net/mari/68Zjt/