- 締切済み
jQueryで複数のラジオボタンを処理
jQueryを最近使い始めました。 以下のようなことをしたいのですが、いいやり方が分かりません。 jQueryを使ってページの読み込み後すぐに、ラジオボタンにチェックを入れたいと思っています。 以下のようにすると実際にチェックが入りました。 HTML <input type="radio" name="a" value="1" /> <input type="radio" name="a" value="2" /> jQuery if(!$("input:radio[name=a]:checked").val()){ $("input:radio[name=a]:first").attr("checked" , "checked"); } ラジオボタンが複数ある場合、上記のjQueryのnameの値を変えたものを増やしていけば対応できたのですが、ラジオボタンがたくさんある場合、同じようなスクリプトが何行も増えてしまいます。 うまく関数にする方法やその他よい対処法はないでしょうか。 <input type="radio" name="a" value="1" /> <input type="radio" name="a" value="2" /> <input type="radio" name="b" value="1" /> <input type="radio" name="b" value="2" /> <input type="radio" name="c" value="1" /> <input type="radio" name="c" value="2" /> … if(!$("input:radio[name=a]:checked").val()){ $("input:radio[name=a]:first").attr("checked" , "checked"); } if(!$("input:radio[name=b]:checked").val()){ $("input:radio[name=b]:first").attr("checked" , "checked"); } if(!$("input:radio[name=c]:checked").val()){ $("input:radio[name=c]:first").attr("checked" , "checked"); } …
- みんなの回答 (2)
- 専門家の回答
みんなの回答
- fujillin
- ベストアンサー率61% (1594/2576)
多少面倒ですが、こんな考え方のものが便利かと… document.ready時に以下の処理を行なう document内のラジオボタンを全て取得 取得したボタンについて、それぞれ以下の処理を行なう name属性を取得 同じname属性のラジオボタンを取得し // *1 checkedの要素が無いか、または値が有効で なかったら、*1の最初の要素にcheckを入れる 少々処理に重複はありますが、まあ、ボタンの数がめちゃくちゃ多いわけでもないでしょうから。 ご提示のスクリプトが、document全体から同じnameのラジオボタンを取得するようになっていますので、(↑)も同様にしていますが、 実際は、*1の要素は「同じform内で同じname属性を持つラジオボタン」にしておいた方が良いと思われます。 formが複数あって、その中でたまたま同じnameのラジオボタンがある場合を考えてみればわかるかと。
- blanc210
- ベストアンサー率55% (5/9)
いくつか方法がありますが 1)ループ(繰り返し)処理を書く jQueryのname部分を変数にしてループ処理 2)デフォルトでcheckが入るものに一定のルールがあればそれで指定 例えば常にvalue=1のものにcheck、といったルールがあるならば。 3)一定のルールがなければclassで class="cheked" のついたものにcheckをつける、とjQueryに書き、 HTML側にはデフォルトでcheckをいれたいものにそのclassをつける 3が楽かなと思いますがいかがでしょう