0

ページが読み込まれた後にこの関数が機能する必要があります。エラーには がありません。true 行の before ステートメント エラー。また、チェックボックスtoggle-allが「チェック済み」としてクリックされたときに、テーブルcheckallのクラスをtrueとしてマークし、toggle-allチェックボックスを再度クリックすると、テーブル内のすべてのチェックボックスをfalseにマークします。ほぼ正しいように見えますが、ブラケットにいくつかのエラーがあります。

$(document).ready(function()  {
     $('#toggle-all, input:checkbox').click(
     function () {
        $('#table, :checkbox').attr(':checked','checked').true);
     },function(){
        $('#table :checkbox').attr(':checked').false);
     }
  );
});



 <section id="main">
     <form id="task-list"> <input id="toggle-all" name="toggle-all" type="checkbox" /> 
      </form>
 </section>

 <table class="table" >
     <tr>
         <td><input type="checkbox" class="checkall"  />item.todo </td>
         <td> item.name</td><td>
     </tr>
......  more rows
 </table>
4

2 に答える 2

1

簡単な解決策:

$(document).ready(function() {

    $("#toggle-all").click(function() {
        $(".table input:checkbox").each(function() {
            $(this).prop("checked", !$(this).prop("checked"));
        });
    });

});

もう少し防弾(常にすべてのチェックボックスを一緒に切り替える):

$(document).ready(function() {

    $("#toggle-all").click(function() {
        $(".table input:checkbox").prop("checked", $(this).prop("checked"));
    });

});​

デモ: http: //jsfiddle.net/Ck43Z/1/

于 2012-11-13T10:20:49.593 に答える
1

attr() と prop() を使用して入力の状態を取得する場合、attr() はデフォルトの状態 (HTML に記述されている) を参照しますが、prop() は現在の状態 (クリックすると変化します) を参照します。その上など)。

それらを使用して新しい状態を設定する場合、それらは同じことを行います。しかし、'checked' 値を設定するために prop() を使用する習慣を身につけるのは良いことです。

$('#toggle-all').click(function() {
    $('table input:checkbox').prop('checked', $(this).is(':checked'));
});

これは単に書き込みの省略形です

$('#toggle-all').click(function() {
    if ($(this).is(':checked')) {
        $('table input:checkbox').prop('checked', true);
    } else {
        $('table input:checkbox').prop('checked', false);
    }
});

if ステートメントの性質上、最初のブランチにいる場合、式 $(this).is(":checked") はとにかく true であり、2 番目のブランチにいる場合は true になるためです。間違い。したがって、'true' と 'false' を記述した場合、どちらの場合も $(this).is(":checked") と記述できます。これを行うと、両方のブランチがまったく同じことを言うので、if ステートメントでそれらを記述する必要がなくなります。

$(this) は、クリックされた要素 (つまり、チェックボックス) を参照します。jQuery でイベントを参照する場合は、次のようにします。

$('.element').click(function(e) {
    // the variable e now refers to the event
});
于 2012-11-15T09:10:56.243 に答える