- ベストアンサー
jQuery変数の使い方について
- ラジオボタンが複数ある場合、変数を使って現在のアクションをまとめる方法について教えてください。
- jQuery内の変数の記述方法に関して、詳細を教えていただきたいです。
- 参考にしたサンプルソースでは、変数を使用してラジオボタンの選択結果を取得し、hiddenフィールドに格納しています。このような処理を実現するためのコードを教えてください。
- megane5050
- お礼率85% (30/35)
- JavaScript
- 回答数3
- ありがとう数4
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
■ $("input:radio[name='radio01']:checked").val(); クリック対象の obj があるのだから、値は obj.value で取れるのに... JavaScript には Perl や bash のような文字列内変数置換機能はありません。 なので、文字列連結でがんばりましょう。 引用符がごっちゃにならないように注意 var name = "radio01"; $("input:radio[name='" + name + "']:checked").val(); ■ document.forms["MON"].hradio02.value object["name"] の書式は、"name"を単純に変数に置換できます。 object.name の書式は、object["name"] と書き換えることにより、同上 というわけで var formName = "MON"; var paramName = "hradio02"; document.forms[formName][paramName].value;
その他の回答 (2)
- LancerVII
- ベストアンサー率51% (1060/2054)
こんにちは。 <label>内にradioが入ったのであれば var $hidden = $(this).parents('td').find('input:hidden'); で取得できます。 クリックされた親要素のtdまで遡り、その中のinput type="hidden"を取得するという動きです。 var $hidden = $(this).parent().parent().find('input:hidden'); でも行けます。
お礼
親要素という奴ですね！！ 大変勉強になりました。 ありがとうございました!
- LancerVII
- ベストアンサー率51% (1060/2054)
こんにちは。 jQueryを利用するなら以下のようにすればお望みの動作が可能です。 (変数にしたいという質問の回答にはなっていません・・・） 動作原理はコメントを参考にしてください。 HTMLの変更点はinputタグのonClickを除去 JavaScriptをjQueryを使うように修正 ==== JavaScript $().ready ( function() { // input type="radio"がクリックされたら $('input:radio').click ( function() { // クリックされたラジオを持つ親要素の中からinput type="hidden"の要素を取得 var $hidden = $(this).parent().find('input:hidden'); // 設定前を表示してみる alert ( $hidden.val() ); // クリックされた要素のvalueを取得 var value = $(this).val(); // hidden要素にセット $hidden.val(value); // 設定後を表示してみる(選択した内容が表示されるはず) alert ( $hidden.val() ); }); }); ==== HTML <form name="MON"> <table border="1"> <tr> <td> 結果: </td> <td> <input type="radio" name="radio01" value="良好">良好 <input type="radio" name="radio01" value="不良"> 不良 <input type="hidden" name="hradio01" value="未入力です。"> </td> </tr> <tr> <td> 結果2: </td> <td> <input type="radio" name="radio02" value="良好">良好 <input type="radio" name="radio02" value="不良"> 不良 <input type="hidden" name="hradio02" value="未入力です。"> </td> </tr> </table> </form>
補足
ご回答ありがとうございます！！ IE6用に<label>タグをラジオボタンにつけた場合、 hideenに値が格納されないのですが、 // クリックされたラジオを持つ親要素の中からinput type="hidden"の要素を取得 var $hidden = $(this).parent().find('input:hidden'); <label>タグをつけても、input type="hidden"の要素を探せる方法はありますでしょうか？ ★ソース <label for="radiocheck01_01"> <input id="radiocheck01_01" type="radio" name="radio01" value="良好">良好</label> <label for="radiocheck01_02"><input id="radiocheck01_02" t type="radio" name="radio01" value="不良"> 不良</label> <input type="hidden" name="hradio01" value="未入力です。">
お礼
回答ありがとうございました！！ function setVal(obj) { var formname = obj.form.name; var radioname = obj.getAttribute("Name"); document.forms[formname]["h"+radioname].value = $("input:radio[name='" + radioname + "']:checked").val();} でできました。 大変助かりました。お礼申し上げます。