0

ボタンのリストがあるとしましょう。各ボタンはクラス「.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?
    });
}

これは思ったよりも注意が必要です。クラス内の別の任意のボタンがチェックされるまで、各ボタンが最後であることを認識しないことを理解してください。

何か助けてください？

4

1 に答える 1

1

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

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

クリックされたボタンに選択されたクラスを追加した後、クラスが「選択された」ボタンのコレクションのサイズがゼロの場合、それが最後のボタンであることがわかります。

さて、あなたの質問は、クラス「ボタン」が付いているボタン（「私は.selectedクラスのない最後の.button」）だけを数えるつもりなのか、それともすべてを数えるつもりなのかが明確ではないという点で少し曖昧です。ボタン要素。クラス「button」のボタンのみをカウントする場合は、次を使用します。

$(this).addClass('selected');
if( $('button.button.selected').length == 0) {
    alert("This is the last button");
}
于 2012-05-06T21:03:41.090 に答える