jQueryに最も近い関数がaddClassで動作しない

Question

jqueryに最も近い関数に問題があります。 私はいくつかの項目をクリックすることができるメニューを作りたいと思います。 私が知りたいことは： 誰かがメニューで既に選択されたアイテムをクリックした場合、選択されたアイテムが選択されたアイテムの前にあるかどうか。 セレクタに一致するdomオブジェクトがある場合は1を返し、存在しない場合は0を返す最も近い関数を見つけました。 クリックされたメニュー項目ごとに選択されたクラスを追加し、再度クリックするとそのクラスを削除します。

menu_2をクリックしてからmenu_3をもう一度クリックすると、最も近い値が1になります。選択したアイテムが選択されていないため、最も近い値が1になります。

これは私の小さなスクリプトの結果ではありませんが、多分あなたは何かを知っていますか？

に関して、 ピーター

$('li').click(function() 
    { 
     if ($(this).hasClass('selected')) 
     { 
     $(this).removeClass('selected'); 
     alert($(this).closest('.selected').size()); 
     } 
     else 
     { 
     $(this).addClass('selected'); 
     } 
    }); 

---

.selected 
    { 
    background-color: red; 
    } 

---

<ul> 
<li>menu_1</li> 
<li>menu_2</li> 
<li>menu_3</li> 
<li>menu_4</li> 
<li>menu_5</li> 
</ul> 

これは私の構造体である：今私はdeselec

menu_0 <- selected 
menu_0_0 
menu_0_1 
menu_0_2 <- selected 
    menu_0_2_0 
    menu_0_2_1 <- selected 
menu_1 
... 

t menu_0_2_1と最も近い関数は、上記の例のように "selected"クラスを持つ最も近いオブジェクトであるため、DOMオブジェクトmenu_0_2を与えてくれます。

Answer 1

あなたはclosest()の目的で混乱している：

が 現在の要素から始まり、DOMツリーを を進め、セレクタと一致していることを最初祖先要素を取得します。

あなたも兄弟を取得したい場合は、すぐに次の使用にnext() ..etcたい場合は、その後、siblings()使用：

$(document).ready(function() { 
    $('li').click(function() { 
     if ($(this).hasClass('selected')) { 
      $(this).removeClass('selected'); 
      alert('Closest: ' + $(this).closest('.selected').length); 
      alert('Siblings: ' + $(this).siblings('.selected').length); 
     } 
     else { 
      $(this).addClass('selected'); 
     } 
     return false; 
    }); 
}); 

Example linkを。バブルの影響を防ぐためにここではreturn false;が重要です！