jQueryを使用して、特定のクラスの残りの要素を特定するにはどうすればよいですか？

Question

私はボタンのリストを持っているとしましょう。各ボタンはクラス ".button"に属します。各ボタンは選択した状態で視覚的に表示されます。各ボタンはまた、それに与えられた機能、すなわちそれに関連するスタイリングクラスを有する。 ".widget-1"、 ".widget-2"、したがって<div class="button widget-1">などです。 $(this).addClass("selected")

私は任意の数のボタンを持っていることに注意してください。リストはデータドリブンでサイズが決められているので実行時に動的に

しかし、のうち1つのみがボタンのまま残されている場合、すなわち、条件が満たされなければならない場合があります。 ".selected"クラスが追加されていない1つのボタン。

は、例示の目的のために、次のコードを考えてみましょう：

for (var n = 0; n < Math.round(Math.random() * 10); n++) { 
    $('<button />').attr({class: 'button widget-' + n}) 
    .appendTo('body') 
    .click(function(){ 
     $(this).addClass('selected'); 
     // Am I the last .button without .selected class? 
    }); 
} 

これは、それが聞こえるよりも複雑です。このクラスでは他の任意のボタンがチェックされているまで、各ボタンは、それが最後で知ることができませんことを実現しています。

お願いします。

Answer 1

クリックハンドラ本体をこのコードブロックに置き換えます。これにより、他のボタンが選択されているかどうかが確認されます。

$(this).addClass('selected'); 
if($('button.selected').length == 0) { 
    alert("This is the last button"); 
} 

「選択」クラスを使用して、ボタンのコレクションのサイズは、クリックされたボタンを選択したクラスを追加した後にゼロである場合は、それが最後の一つだ知っています。

ここでは、クラス「ボタン」（「選択されたクラスなしの最後のボタンです」）を含むボタンだけをカウントするかどうかは不明です。すべてのボタン要素を数えようとする。あなただけのクラス「ボタン」とボタンをカウントしたい場合は、使用したい：

$(this).addClass('selected'); 
if($('button.button.selected').length == 0) { 
    alert("This is the last button"); 
}