Javascriptの兄弟は

Question

これは、私が以前に求めてきました質問に関連しているのonclick：基本的にCalling Javascript function after loading an AJAX page

、すべてのサムネイルが一つの容器と呼ばれる#left_boxに動的にロードされる前に。下のスクリプトを使って、すべての兄弟から1つのdivをハイライトさせることができます。

$('.thumbnail_small').live('click', function(){ 
    $(this) 
     .css('border-color','#000') 
     .siblings() 
     .css('border-color','#ccc'); 
}); 

しかし、新機能に対応するために、私は.containと呼ばれるも、それ以上の容器の中にサムネイルを分割しなければなりませんでした。基本的に#left_boxには、x個のサムネイルを保持する一連の.containが含まれています。 .containのサムネイルをクリックすると、大きなコンテナではなくそのコンテナ内の兄弟にのみ影響します#left_box。

私は

$('#left_box').on('click', '.thumbnail_small', function(){ 
    $(this) 
     .css('border-color','#000') 
     .siblings() 
     .css('border-color','#ccc'); 
}); 

を試してみましたが、それは動作しません。何か案は？前もって感謝します。

Answer 1

私は、現在の要素を除外するnot方法を使用して、あなたのseletorを繰り返すことをお勧めしたい：

$('#left_box').on('click', '.thumbnail_small', function(){ 
    $(this).css('border-color','#000'); 
    $('#left_box .thumbnail_small').not(this).css('border-color','#ccc'); 
}); 

これは、その後、残りの部分にCSSを適用し、クリックされたものを除外し、自分の#left_box内のすべての.thumbnail_smallを選択しますそのうちの。