※ ChatGPTを利用し、要約された質問です(原文:jQuery 変数の使い方について)
jQuery変数の使い方について
このQ&Aのポイント
ラジオボタンが複数ある場合、変数を使って現在のアクションをまとめる方法について教えてください。
jQuery内の変数の記述方法に関して、詳細を教えていただきたいです。
参考にしたサンプルソースでは、変数を使用してラジオボタンの選択結果を取得し、hiddenフィールドに格納しています。このような処理を実現するためのコードを教えてください。
jQuery 変数の使い方について
【やりたいこと】
ラジオボタンが複数ある為現在のアクションをまとめたい。
■ $("input:radio[name='radio01']:checked").val();
の'radio01'の部分に変数を使いたい。
■document.forms["MON"].hradio02.value
の"MON"のフォーム名と、「hradio02」name部分に変数を使いたい。
http://kaicoo.blogspot.jp/2012/03/query_30.html
等を参考に元のソースから
JSをまとめてみましたが、うまくいきません。
jQuery内の変数の記述方法を
教えていただけませんでしょうか?
よろしくお願いいたします。
★JSをまとめたサンプルソース
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META http-equiv="Content-Style-Type" content="text/css">
<script src="jquery.js"></script>
<script type="text/javascript" language="JavaScript">
<!--
function setVal(obj) {
var formname = obj.form.name;
var radioname = obj.getAttribute('name');
alert(formname);
alert(radioname);
//選択したラジオのvalueをhiddenに格納する
document.forms[formname].h '+ radioname +' .value = $("input:radio[name='+ radioname +']:checked").val();
alert(document.forms[formname].h '+ radioname +'.value);
}
//-->
</script>
</head>
<body>
<table border="1">
<FORM name="MON">
<tr>
<td>
結果:
</td>
<td>
<input type="radio" name="radio01" value="良好" onClick="setVal(this);" >良好
<input type="radio" name="radio01" value="不良" onClick="setVal(this);"> 不良
<input type="hidden" name="hradio01" value="未入力です。">
</td>
</tr>
<tr>
<td>
結果2:
</td>
<td>
<input type="radio" name="radio02" value="良好" onClick="setVal(this);" >良好
<input type="radio" name="radio02" value="不良" onClick="setVal(this);"> 不良
<input type="hidden" name="hradio02" value="未入力です。">
</td>
</tr>
</table>
</Form>
</body>
</html>
★元のソースのサンプル
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META http-equiv="Content-Style-Type" content="text/css">
<script src="jquery.js"></script>
<script type="text/javascript" language="JavaScript">
<!--
function setVal_01(obj) {
document.forms["MON"].hradio01.value =
$("input:radio[name='radio01']:checked").val();
alert(document.forms["MON"].hradio01.value);
}
//-->
</script>
<script type="text/javascript" language="JavaScript">
<!--
function setVal_02(obj) {
document.forms["MON"].hradio02.value =
$("input:radio[name='radio02']:checked").val();
alert(document.forms["MON"].hradio02.value);
}
//-->
</script>
</head>
<body>
<table border="1">
<FORM name="MON">
<tr><td>
結果:
</td>
<td><input type="radio" name="radio01" value="良好" onClick="setVal_01(this);" >良好
<input type="radio" name="radio01" value="不良" onClick="setVal_01(this);"> 不良
<input type="hidden" name="hradio01" value="未入力です。">
</td>
</tr>
<tr>
<td>
結果2:
</td>
<td>
<input type="radio" name="radio02" value="良好" onClick="setVal_02(this);" >良好
<input type="radio" name="radio02" value="不良" onClick="setVal_02(this);"> 不良
<input type="hidden" name="hradio02" value="未入力です。">
</td>
</tr>
</table>
</Form>
</body>
</html>
お礼
回答ありがとうございました!! 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();} でできました。 大変助かりました。お礼申し上げます。