[解決済み] jQueryを使用して、ボタンですべてのチェックボックスをチェック/アンチェックするにはどうすればよいですか?
2022-04-21 03:12:56
質問
jQueryを使ってすべてのチェックボックスのチェック/アンチェックをしようとしています。現在、親チェックボックスをチェック/アンチェックすることによって、すべての子チェックボックスも選択/選択解除され、親チェックボックスのテキストはcheckall/uncheckallに変更されています。
今、私は親のチェックボックスを入力ボタンに置き換え、ボタンのテキストもcheckall/uncheckallに変更したいと思います。ここにコードがありますが、どなたかコードをいじっていただけませんか?
$( function() {
$( '.checkAll' ).live( 'change', function() {
$( '.cb-element' ).attr( 'checked', $( this ).is( ':checked' ) ? 'checked' : '' );
$( this ).next().text( $( this ).is( ':checked' ) ? 'Uncheck All' : 'Check All' );
});
$( '.cb-element' ).live( 'change', function() {
$( '.cb-element' ).length == $( '.cb-element:checked' ).length ? $( '.checkAll' ).attr( 'checked', 'checked' ).next().text( 'Uncheck All' ) : $( '.checkAll' ).attr( 'checked', '' ).next().text( 'Check All' );
});
});
<input type="checkbox" class="checkAll" /> <b>Check All</b>
<input type="checkbox" class="cb-element" /> Checkbox 1
<input type="checkbox" class="cb-element" /> Checkbox 2
<input type="checkbox" class="cb-element" /> Checkbox 3
解決方法は?
これを試してみてください。
$(document).ready(function(){
$('.check:button').toggle(function(){
$('input:checkbox').attr('checked','checked');
$(this).val('uncheck all');
},function(){
$('input:checkbox').removeAttr('checked');
$(this).val('check all');
})
})
関連
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] jQueryでチェックボックスに "checked "を設定する
-
[解決済み] どのラジオボタンが選択されているかをjQueryで知るにはどうしたらよいですか?
-
[解決済み] jQueryでページを更新するにはどうすればよいですか?
-
[解決済み] jQueryで要素にスクロールする
-
[解決済み] jQueryで入力を無効化/有効化する?
-
[解決済み] jQueryで複数のクラスを持つ要素を選択するにはどうすればよいですか?
-
[解決済み] jQueryのn番目の要素を取得する方法
-
[解決済み】jQueryでチェックボックスがチェックされているかどうかを確認するにはどうすればよいですか?
-
[解決済み】チェックボックスがチェックされているかどうかをjQueryで確認する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] クラスメソッド内の "this "をタイプスクリプトで記述する
-
[解決済み] jQueryでPUT/DELETEリクエストを送信する方法は?
-
[解決済み] 既存の非順序型リストにリストアイテムを追加する方法
-
[解決済み] jQueryで複数のCSS属性を定義するには?
-
[解決済み] jQuery removeClass ワイルドカード
-
[解決済み] val()を使ってselectの値を設定しても、jqueryのchangeイベントが発生しないのはなぜですか?
-
[解決済み] セレクトボックスの選択項目を設定する
-
[解決済み] jQueryを使用して要素の型を検索する
-
[解決済み】jQueryで入力不可属性をトグルする。
-
[解決済み] jQueryを使用してすべてのチェックボックスをチェックする方法は?