3

チェックボックスがチェックされているかどうかに関する情報を選択して使用できるはずのjqueryを使用してjavascriptを作成しようとしています。これは、チェックボックス (id 'edit-toggle-me' を持つ) がクリックされるたびに発生するはずです。成功したかどうかを確認するために、いくつかの alert() を含むテスト関数を作成しました。

(function ($) {
    "use strict";
    $(document).ready(function () {

        $('#edit-toggle-me').click(function(){

            if ($('#edit-toggle-me').checked()) {
                alert('Yup!');
            }
            else {
            alert('Nup!');
            }


        });
    });

})(jQuery);

どちらのアラートも実行しないため、$('#edit-toggle-me').checked() でクラッシュすると推測しています。理由はわかりませんが。

私もこれを試しました:

(function ($) {

    $(document).ready(function () {

        $('#edit-toggle-me').click(function(){
            var elementy = document.getElementById('edit-toggle-me');
            var check = elementy.value;
            alert(check);
            if(elementy.checked()) {
                alert('yup');
            }
        });
    });
})(jQuery);

最初のアラートは機能しますが、最後の 2 つの「yup」または「nup」はどちらも機能しません。

そして、私もこれを試しました:

(function ($) {

     $(document).ready(function () {

        $('#edit-toggle-me').click(function(){

            var element2 = document.getElementById('edit-toggle-me');
            var check = element2.value;
            alert(check);

        });
    });
   })(jQuery);

これは常に1を返します。理由もわかりません。

ヒントに感謝します。

4

4 に答える 4

5

を使用し.is(':checked')ます。ドキュメントはHEREにあります。

JSFIDDLE

于 2012-08-13T13:27:13.477 に答える
4

.checked()jQuery や DOM APIのようなメソッドはありません。要素がチェックされているかどうかを示す単純な.checkedプロパティが要素にあります。これを試して:truefalse

(function ($) {
    "use strict";
    $(document).ready(function () {

        $('#edit-toggle-me').click(function(){
            alert( this.checked ? ":)" : ":(" );
        });
    });

})(jQuery);

デモを参照してください: http://jsfiddle.net/scZ3X/

于 2012-08-13T13:27:08.920 に答える
1
$(function(){
    $('#edit-toggle-me').on('change', function(){
        if($(this).is(':checked')) {
            alert('checked');
        }
        else {
            alert('unchecked');
        }
    });
});

代わりに「change」イベントを使用する必要があります。場合によっては、クリックイベントをチェックボックスやラジオボタンで使用するのは適切ではないためです。

例1:

ラジオボタンがある場合は、クリックイベントバインドを使用します。ラジオボタンがすでにtrueで、ラジオボタンをクリックした場合。ラジオボタンの値は変更されませんが、クリックイベントは毎回発生します。

ただし、changeイベントを使用する場合。イベントは、ラジオボタンの値が変更された場合にのみ発生します(まだチェックされていないか、trueの場合)

例2: ラジオボタンまたはチェックボックスのラベルがある場合。チェックボックスまたはラジオボタンでイベントバインドをクリックした場合。ラベルをクリックすると、チェックボックスまたはラジオボタンの値が変更されますが、クリックイベントは呼び出されません。

変更イベントの場合。ラベル関連のラベルをクリックしても期待どおりに動作します。

于 2012-08-13T13:54:44.243 に答える
0

これを試して:

$('#edit-toggle-me').is(':checked')
于 2012-08-13T13:31:52.507 に答える