jQueryは、webサイトのJavascriptのコーディングを簡素化し、ブラウザ間の互換性の問題の多くを削除することができますJavascriptフレームワークです。 昨日、jQueryでフォーム要素の値を取得および設定する方法を見ましたが、チェックボックスを処理しませんでした。 今日の投稿では、htmlフォームのチェックボックスがjQueryでチェックされているかどうかを確認する方法と、チェックされていないかどうかを確認する
サンプルフォーム
サンプルフォームは次のようになります:
<input type="checkbox" name="foo" value="bar" /><input type="button" onclick="show_checked()" value="Show" /><input type="button" onclick="set_checked(true)" value="On" /><input type="button" onclick="set_checked(false)" value="Off" />
「foo」という名前のcheckboxがあり、次に3つのボタンがあります。 最初の関数は、チェックボックスがチェックされているかどうかを示す関数を呼び出し、2番目の2つはチェックされているからチェックされていないに変更します。
チェックボックスがチェックされているかどうかを確認する
jQueryでチェックボックスがチェックされているかどうかを確認する方法はいくつかあり、ここではいくつかの選択肢があります。 それぞれがチェックされている場合はtrueを返し、そうでない場合はfalseを返します。
$('input').is(':checked')$('input').attr('checked')
チェックボックスをチェックまたはチェックされていないに設定
チェックボックスのステータスは、attr()関数を使用して変更することができます。:
$('input').attr('checked', true);
そして、そのようなボックスをオフにするには:
$('input').attr('checked', false);
実際の例
最後に、実際のフォームの例を次に示します:
ブール値に関する注意
Chromiumで見つかった問題については、trueとfalseの文字列値が渡されることに関連する可能性がありますが、厳密にブール値trueまたはfalse
を使用することが推奨されています。代わりにremoveAttr（）が、これは関数のjQueryドキュメントページのコメントを読んだことから他の結果が生じる可能性があります。 私は後日この記事をフォローアップし、
ラベルをクリックしたときにチェックボックスを切り替える
Javascriptは、いくつかのテキストをクリックしたときにチェックボックスを切り替える必要はないことに注意してください。それがHTML<label>sのためのものです。 HTML<label>を使用して私のフォローアップ投稿を読んで、詳細についてはフィールドを切り替えて選択してください。