0

こちらのチュートリアルを使用して、jqueryでWebページのチェックボックスをスタイリングしていました

しかし、リスト内のすべてのチェックボックスを選択するSelectAllチェックボックスを実行できないことに気付きました。バックエンドでは機能しますが（チェックボックスが選択されています）、私のページには表示されません。

私の問題を示すためにデモを追加しました。テストするには、システムに移植する必要がある場合があります

デモ

[すべて選択]チェックボックス機能を実現するために、のjQueryカスタムラジオボタンとチェックボックスjavascriptファイルに何を追加できますか

ありがとうございました！

4

2 に答える 2

1

あなたはこのフィドルを試すことができます ：

$(function () {
    var $chbxs = $('.checkbox');
    $('#sel_all_lbl').toggle(
        function() {
            $chbxs.css('background-position', '50% -50px');
            $('#checkboxall .truefalse').prop('checked', true);
        },
        function() {
            $chbxs.css('background-position', '50% 0px');
            $('#checkboxall .truefalse').prop('checked', false);
        }
    );
});

私は何をしましたか？まず、フィドルでいくつかの構文エラーを修正する必要があります。次に、プラグインコードをDOMに追加し、スクリプトをスクリプトパネルに追加して、DOMの準備ができたときにスクリプトが起動するようにします。（これはすべてjsFiddleに関するものなので、どのように機能するかを理解してください）

.toggle()実際のコードについては、チェックボックス要素にクリックハンドラー（）を付加しました。ただし、クリックイベントは発生しません。スクリプトはチェックボックスのプロパティを変更しただけですが、クリックはありません。したがって、これらのハンドラーを、ユーザーが実際にクリックしたい要素、つまり正方形のアイコンにアタッチする必要があります。（私はそれに追加しid="sel_all_lbl"ました）

于 2012-09-15T09:30:22.350 に答える
0

[すべて選択]チェックボックスでイベント処理を使用し、JavaScriptからすべてのチェックボックスを手動でチェックしてみてください。

于 2012-09-15T09:03:47.040 に答える