41

関数をトリガーする要素内にあるチェックボックスをオン/オフにする適切な方法は何ですか?

これが私のコードです:

<table id="news_list">
<tr>
    <td><input type="checkbox" name="news[1]" /></td>
    <td>TEXT</td>
</tr></table>

$("#news_list tr").click(function() {
    var ele = $(this).find('input');
    if(ele.is(':checked')){
        ele.removeAttr('checked');
        $(this).removeClass('admin_checked');
    }else{
        ele.attr('checked', 'checked');
        $(this).addClass('admin_checked');
    }
});

問題は、各ボックスのオンとオフを1回しかできないことです。チェックした後もチェックを外した後でも、クラスの追加/削除が行われることがありますが、チェックボックスを再度オンにすることはありません(テーブルの行ではなくチェックボックスをクリックした場合でも)。

.bind('click')トリガーを使用してみましたが、同じ結果です。

解決策はありますか?

4

3 に答える 3

47

代わりに使用.prop()し、コードを使用する場合は、次のように比較します。

jsbinの例を見てください:

  $("#news_list tr").click(function () {
    var ele = $(this).find(':checkbox');
    if ($(':checked').length) {
      ele.prop('checked', false);
      $(this).removeClass('admin_checked');
    } else {
      ele.prop('checked', true);
      $(this).addClass('admin_checked');
    }
 });

変更点:

  1. inputに変更:checkbox
  2. the lengthの比較checked checkboxes
于 2013-02-08T10:03:13.530 に答える
20

の値を設定するには、attr() の代わりに prop() を使用しますchecked:checkbox代わりにfindメソッドでも使用し、input具体的にしてください。

ライブデモ

$("#news_list tr").click(function() {
    var ele = $(this).find('input');
    if(ele.is(':checked')){
        ele.prop('checked', false);
        $(this).removeClass('admin_checked');
    }else{
        ele.prop('checked', true);
        $(this).addClass('admin_checked');
    }
});

check などのプロパティには、attr の代わりに prop を使用します

jQuery 1.6 以降、.attr() メソッドは、設定されていない属性に対して undefined を返します。フォーム要素のチェック状態、選択状態、無効状態などの DOM プロパティを取得および変更するには、.prop() メソッドを使用します。

于 2013-02-08T09:30:03.470 に答える