チェックボックスとラジオボタンの値取得について

前へ 次へ
このQ&Aのポイント
  • チェックボックスの中にラジオボタンがある場合に、チェックボックスの値に続けてラジオボタンの値を表示したい。
  • labelタグを付けたまま値を取得することは可能でしょうか？
  • 何かよい方法があれば教えて頂けないでしょうか。
回答を見る
  • ベストアンサー

チェックボックス　とラジオボタンの値取得について

チェックボックス　とラジオボタンの値取得について こんにちは チェックボックスの中にラジオボタンがある場合に チェックボックスの値に続けてラジオボタンの値を表示したいのですが、 うまくいかず悩んでいます。 【やりたいこと】 □そのた２をチェクして男性を選択した場合　「そのた２ 男性」と表示したい。 例 そのた１ そのた２ 男性 そのた４ そのた５ 女性 サンプルのチェックボックスのlabelタグをはずすと $(vals[i]).next($("input[name='radio']:checked").val()); で値を取得できたのですが、 labelタグを付けたまま値を取得することは可能でしょうか？ labelタグをつけたまま、 $(vals[i]).find($("input[name='radio']:checked").val()); でやってみたのですが、undefindがでてしまいました。 サンプルではチェックボックスの数は１個ですが、 □が３０個以上　のチェックボックスが５０個くらいあるので、 １回の記述で済ませたいのですが、 ラジオボタンが隣にあったら値を取得する　のようにできるのでしょうか？ 何かよい方法があれば教えて頂けないでしょうか。 よろしくお願い致します。 ■サンプルソース <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <script type="text/javascript" language="JavaScript"></script> <script language="javascript"> <!-- function textb(){ var str=""; var vals = document.forms['f'].elements['q1']; for(i=0; i<vals.length; i++){ if(vals[i].checked){ str=str + vals[i].value + '\n'; } } document.f.log.value=str; } --> </script> <title></title> </head> <body> <form name="f"> <div>アンケート<br> <label for="1"><input type="checkbox" name="q1" class="chex" id="1" value="その1"> その1</label><br> <label for="2"><input type="checkbox" name="q1" class="chex" id="2" value="その2"> その2</label> <input type="radio" name="radio1" value="可">男性 <input type="radio" name="radio1" value="否">女性 <br> <label for="3"><input type="checkbox" name="q1" class="chex" id="3" value="その3"> その3</label><br> <label for="4"><input type="checkbox" name="q1" class="chex" id="4" value="その4"> その4</label><br> <label for="5"><input type="checkbox" name="q1" class="chex" id="5" value="その5"> その5</label> <input type="radio" name="radio2" value="可">男性 <input type="radio" name="radio2" value="否">女性 <br> </div> <input type="button" value="確認" onclick="textb()"> <input type="reset" value="クリア"> <br> <textarea name="log" rows="4" cols="50"></textarea></form> </body> </html>

質問者が選んだベストアンサー

  • ベストアンサー
  • Ogre7077
  • ベストアンサー率65% (170/258)
回答No.2

> parent()で戻って　radioボタンを探すみたいな感じで一度試してみます。 それでも可能ではありますが、あまり良い処理とは思えません。 HTML にちょっとした修正を加えるだけで、その都度スクリプトに修正が必要となるからです。 たとえば、ラジオボタンを<label>で囲むとか、スタイルの為に<span>を挿入するとか。 というわけで HTML 構造から見直しては如何でしょうか? <!-- チェックボックス毎に<li>で囲む(終了タグは省略可能です) --> <ul> <li> <label><input type="checkbox" name="q1" value="その1"> その1</label> <li> <label><input type="checkbox" name="q1" value="その2"> その2</label> 　<span class=男><label><input type="radio" name="radio1" value="可">男性</label></span> 　<span class=女><label><input type="radio" name="radio1" value="否">女性</label></span> <li> <label><input type="checkbox" name="q1" value="その3"> その3</label> </ul> // チェックボックを囲む <li> の内部に、 // 選択済みラジオボタンを含むなら、値を読み取る var s = vals[i].value; var r = $(vals[i]).closest('li').find('input[type=radio]:checked'); if (r.length > 0) s += ' ' + r.val(); str += s + '\n';

megane5050
質問者

お礼

ご回答ありがとうございます！ 記述いただいたものを使い出来ました！！ closest　使うんですね！！ // チェックボックを囲む <li> の内部に、 // 選択済みラジオボタンを含むなら、値を読み取る 他の箇所にも使えそうです！ ありがとうございました。

その他の回答 (2)

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.3

＞labelの位置は　文字をクリックしたときにチェックボックスも・・・・点線で囲まれていてほしい、と言われたのでその位置にしてあるそうです。 どうしてもということであれば、とめませんが・・・ 某世界で一番普及しているクズなブラウザだと、１クリックでチェックは入れられても もうワンクリックしてもチェックが外れなかったりしてUI最悪ですがよろしいですね？

megane5050
質問者

お礼

すいません、わたくしも過去にlabelの位置を直したのですが、却下されまして＞＜ >>某世界で一番普及しているクズなブラウザだと、１クリックでチェックは入れられても もうワンクリックしてもチェックが外れなかったりしてUI最悪 知りませんでした！次回同じような要望があれば、使い勝手悪くなりますよと説明してみます。 ご回答ありがとうございました。

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

＞labelタグを付けたまま値を取得することは可能でしょうか？ そもそもlabelの付け方が変ですよね ターゲットになる(forで指定する)オブジェクトを囲まないほうがよいでしょう 数字だけで命名したidも仕様としておかしい それと document.f.log.value=str; とあるけど、別のところでforms[・・・].elements[・・・]と書いているので それに合わせたほうがよいでしょう。 で、今回の例でlabel付きでアクセスするには、最低でも parentNodeにもどって処理しないと構造的にはおかしいでしょうね

megane5050
質問者

お礼

回答ありがとうございます！ labelの位置は　文字をクリックしたときにチェックボックスも・・・・点線で囲まれていてほしい、と言われたのでその位置にしてあるそうです。 idはわたくしの横着です申し訳ありません。（本当のソースはキチンと命名されてます＞＜ >>parentNodeにもどって処理しないと構造的にはおかしいでしょうね 。 単純に隣の隣の値という感じでは取得はできないんですね＞＜ parent()で戻って　radioボタンを探すみたいな感じで一度試してみます。 ありがとうございました！

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • ラジオボタンとチェックボックスの計算について

    ラジオボタンとチェックボックスで選択して、その合計を表示させたいのですが、合計の最高は50になる用に作ったのですが、9点にしかなりません。 私が考えるに、<script language="JavaScript">～</script>の間が間違っていると思うのですがどうでしょうか？ 皆様ご教授の程お願いします。 <script language="JavaScript"> <!-- // 項目の合計を計算 function ttlValue() { chn = 10; // ラジオボタンとチェックボックスの総数 ttl = 0; for(i=0; i<chn; i++) { if(document.nForm.elements[i].checked) { ttl += eval(document.nForm.elements[i].value); } } document.nForm.result.value = ttl; } //--> </script> </head> <body alink="#000000" bgcolor="#f0f8ff" link="#00ffff" text="#000000" vlink="#ff0000"> <br> それぞれの項目で該当する回答を1つずつ選択して下さい。 <form name="nForm">項目1<br> <input name="ch1" value="3" checked="checked" type="radio">a<br> <input name="ch1" value="2" type="radio">b<br> <input name="ch1" value="1" type="radio">c<br> <input name="ch1" value="0" type="radio">d<br> <br> 項目2<br> <input name="ch2" value="3" checked="checked" type="radio">a<br> <input name="ch2" value="2" type="radio">b<br> <input name="ch2" value="1" type="radio">c<br> <input name="ch2" value="0" type="radio">d<br> <br> 項目3<br> <input name="ch3" value="3" checked="checked" type="radio">a<br> <input name="ch3" value="2" type="radio">b<br> <input name="ch3" value="1" type="radio">c<br> <input name="ch3" value="0" type="radio">d<br> <br> 項目4<br> <input name="ch4" value="1" checked="checked" type="radio">a<br> <input name="ch4" value="0" type="radio">b<br> <br> 項目5<br> <input name="ch5" value="1" checked="checked" type="radio">a<br> <input name="ch5" value="0" type="radio">b<br> <br> オプションがあれば選択して下さい。（複数選択可）<br> <input name="bx1" value="1" type="checkbox">1<br> <input name="bx1" value="1" type="checkbox">2<br> <input name="bx1" value="1" type="checkbox">3<br> <input name="bx1" value="1" type="checkbox">4<br> <input name="bx1" value="1" type="checkbox">5<br> <input name="bx1" value="1" type="checkbox">6<br> <input name="bx1" value="1" type="checkbox">7<br> <input name="bx1" value="1" type="checkbox">8<br> <input name="bx1" value="1" type="checkbox">9<br> <input name="bx1" value="1" type="checkbox">10<br> <input name="bx1" value="1" type="checkbox">11<br> <input name="bx1" value="1" type="checkbox">12<br> <input name="bx1" value="1" type="checkbox">13<br> <input name="bx1" value="1" type="checkbox">14<br> <input name="bx1" value="1" type="checkbox">15<br> <input name="bx1" value="1" type="checkbox">16<br> <input name="bx1" value="1" type="checkbox">17<br> <input name="bx1" value="1" type="checkbox">18<br> <input name="bx1" value="1" type="checkbox">19<br> <input name="bx1" value="1" type="checkbox">20<br> <input name="bx1" value="1" type="checkbox">21<br> <input name="bx1" value="1" type="checkbox">22<br> <input name="bx1" value="1" type="checkbox">23<br> <input name="bx1" value="1" type="checkbox">24<br> あなたの獲得したメダルは何色？<br> <select name="ch2"> <option value="0" selected="selected">なし</option> <option value="5">金メダル</option> <option value="3">銀メダル</option> <option value="1">銅メダル</option> </select> <br> <br> メダル獲得まで何年かかりましたか？<br> 項目6<br> <input name="ch6" value="10" checked="checked" type="radio">20年以上<br> <input name="ch6" value="5" type="radio">19年～10年<br> <input name="ch6" value="3" type="radio">9年～5年<br> <input name="ch6" value="1" type="radio">4年～3年<br> <input name="ch6" value="0" type="radio">2年未満<br> <br> <input value="合計金額を計算" onclick="ttlValue()" type="button"><br> <br> 合計<input name="result" size="10" type="text"> </form> <br>

  • ラジオボタンの選択でチェックボックスのON/OFFを連動

    ラジオボタンを選択すると、連動してチェックボックスにチェックが入れられる仕組みを作りたいのですが。 本番環境ではこの仕組みを3つほど使用したいです。 現在ここまでは出来ていますが、2つ・3つとこの仕組みを増やすと、動作が出来なくなってしまいます。 さらに、ラジオボタンを選択するたびにチェックボックスのチェックが初期化される仕組みにしたいのですが・・・＞＜ どなたか教えて頂けないでしょうか？ <html> <head> <script> window.onload=function(){ document.getElementById("deta1").onclick=function(){ detagroupDisabled(this.form,true); } document.getElementById("deta2").onclick=function(){ detagroupDisabled(this.form,true); } document.getElementById("deta3").onclick=function(){ detagroupDisabled(this.form,false); } } function detagroupDisabled(f,flg){ var objs=f.getElementsByTagName("input"); for(var i=0;i<objs.length;i++){ if(objs[i].className=="detagroup") objs[i].disabled=flg; } } </script> </head> <body> <form action="./postmail.cgi" method="post"> <input type="radio" name="FPCデータ" id="deta3" value="アリ"><label for="deta3">アリ</label> <input type="checkbox" name="FPCデータ アリ" id="DXF" class="detagroup" value="DXF" disabled><label for="DXF">DXF</label> <input type="checkbox" name="FPCデータ アリ" id="ガーバ" class="detagroup" value="ガーバ" disabled><label for="ガーバ">ガーバ</label> <input type="checkbox" name="FPCデータ アリ" id="PDF" class="detagroup" value="PDF" disabled><label for="PDF">PDF</label> <input type="radio" name="FPCデータ" id="deta1" value="ナシ" checked><label for="deta1">ナシ</label> <input type="radio" name="FPCデータ" id="deta2" value="アリ"><label for="deta2">相談</label><br><br> <input type="radio" name="補強板" value="ナシ" checked="checked">ナシ <input type="radio" name="補強板" value="アリ">アリ <input type="checkbox" name="補強板" value="ポリイミド">ポリイミド <input type="checkbox" name="補強板" value="ポリエステル">ポリエステル <input type="checkbox" name="補強板" value="ガラエポ">ガラエポ <input type="checkbox" name="補強板" value="相談">相談<br><br> <input type="radio" name="印刷" value="ナシ" checked="checked">ナシ <input type="radio" name="印刷" value="アリ">アリ <input type="checkbox" name="印刷" value="銀シールド">銀シールド <input type="checkbox" name="印刷" value="銀ペースト">銀ペースト <input type="checkbox" name="印刷" value="銅ペースト"> 銅ペースト <input type="checkbox" name="印刷" value="シルク">シルク 色 <SELECT NAME="印刷"> <OPTION SELECTED VALUE="---">--- <OPTION VALUE="白">白 <OPTION VALUE="黒">黒 <OPTION VALUE="他">他 </SELECT> 　 </form> </body> </html>

  • チェックボックスが複数ある場合の値取得について

    【javascript】チェックボックスが複数ある場合の値取得について こんにちは。 チェックボックスのグループが複数ある場合に、値取得のロジックをチェックボックスのグループ毎に記述せず、 まとめて１つのロジックで取得できる記述方法はありますでしょうか？ 色々と検索しましたが、解決できず何かよい方法があれば教えて頂けないでしょうか。 よろしくお願い致します。 ■やりたいこと ・チェックボックスの値取得の記述を１つにまとめたい。 サンプルソースでは、チェックボックスのグループが3つで、チェックボックスの値取得のソースも３つ記述しています。 チェックボックスのグループを50個設置すると、50回値取得のソースを記述することになってしまうので、１つの記述にまとめたいです。 ■サンプルソース <!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> <style type="text/css"> table {border: solid;} td{width:150px;} </style> <script type="text/javascript" language="JavaScript"><!-- 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(); } // --></script> <script type="text/javascript" language="JavaScript"><!-- function disp(obj){ var naiyo02=""; var naiyo03=""; var naiyo04=""; var flag = 0; //チェックボックス1の値 for(i=0; i<document.forms["test"].checkbox02.length; i++){ if(document.forms["test"].checkbox02[i].checked){ naiyo02 = naiyo02 + "■本日は月曜日:"+ document.forms["test"].hradio00.value + '　' + document.forms["test"].checkbox02[i].value + '\n'; flag = flag+1; }} if(flag == 0){ naiyo02 = "■本日は月曜日:"+ document.forms["test"].hradio00.value + '　' + "未選択"+ '\n'; } //チェックボックス2の値 for(i=0; i<document.forms["test"].checkbox03.length; i++){ if(document.forms["test"].checkbox03[i].checked){ naiyo03 = naiyo03 + "■本日は火曜日:"+ document.forms["test"].hradio00.value + '　' + document.forms["test"].checkbox03[i].value + '\n'; flag = flag+1; }} if(flag == 0){ naiyo03 = "■本日は火曜日:"+ document.forms["test"].hradio00.value + '　' + "未選択"+ '\n'; } //チェックボックス3の値 for(i=0; i<document.forms["test"].checkbox04.length; i++){ if(document.forms["test"].checkbox04[i].checked){ naiyo04 = naiyo04 + "■本日は水曜日:"+ document.forms["test"].hradio00.value + '　' + document.forms["test"].checkbox04[i].value + '\n'; flag = flag+1; }} if(flag == 0){ naiyo04 = "■本日は水曜日:"+ document.forms["test"].hradio00.value + '　' + "未選択"+ '\n'; } str = naiyo02 +'\n'+ naiyo03 +'\n'+ naiyo04 +'\n'; alert(str); } // --></script> </head> <body> <FORM name="test"> <table> <tr> <td class="c"> ■天気 </td> <td class="n" > <label for="radiocheck04"><input type="radio" id="radiocheck04" name="radio00" value="晴れ" onClick="setVal(this);">晴れ</label> <label for="radiocheck05"><input type="radio" id="radiocheck05" name="radio00" value="曇り" onClick="setVal(this);">曇り</label> <input type="hidden" name="hradio00" value="未入力"><br> </td> </tr> </table> <table> <tr> <td class="c" > ■月曜日<br>　(複数選択可) </td> <td class="n" > <input type="checkbox" name="checkbox02" value="さくら">さくら<br> <input type="checkbox" name="checkbox02" value="まっちゃ">まっちゃ<br> <input type="checkbox" name="checkbox02" value="不明"> 不明<br> </td> </tr> </table> <table> <tr> <td class="c" > ■火曜日<br>　(複数選択可) </td> <td class="n" > <input type="checkbox" name="checkbox03" value="バニラ">バニラ<br> <input type="checkbox" name="checkbox03" value="不明"> 不明<br> </td> </tr> </table> <table> <tr> <td class="c" > ■火曜日<br>　(複数選択可) </td> <td class="n" > <input type="checkbox" name="checkbox04" value="いちご">いちご<br> <input type="checkbox" name="checkbox04" value="ミント">ミント<br> <input type="checkbox" name="checkbox04" value="バニラ">バニラ<br> <input type="checkbox" name="checkbox04" value="不明"> 不明<br> </td> </tr> </table> <input type="button" value="確認" onclick="javascript:disp(this.form)"> </Form> <body> </html>

  • チェックボックスから配列を使って値を受け取る方法

    チェックボックスから配列を使って値を受け取る方法について、 以下の通りに試してみたのですが、上手く行かず、 配列$fCに値が入りません。 どなたか原因を教えていただけないでしょうか。 ------------------------------------------------ hoge.html <form action="hoge.php"> <input type="checkbox" name="fC[]" value="hoge"> hoge <br> <input type="checkbox" name="fC[]" value="foo"> foo <br> <input type="checkbox" name="fC[]" value="bar"> bar <br> <input type="submit" value="OK"> </form> ---------------------------------------------------------- ------------------------------------------------- hoge.php <? for( $i=0; $i<count($fC); $i++ ) { print $i ." ::: " . $fC[$i] . "<br>\n"; } ?> ----------------------------------------------------------

    • ベストアンサー
    • PHP
  • selectした項目によって、radioボタンの値を変える方法

    selectボックスの値によって、ラジオボタンに自動的にチェックを入れるというものを作りたいのですが、やり方がわからないのでどなたか回答をお願いします。 selectボックスは、 <select name="Q01" id="Q01"> <option selected>▼選択</option> <option value="1">Ａコース</option> <option value="2">Ｂコース</option> <option value="3">Ｃコース</option> </select> というようなものを用意しています。 ラジオボタンは、 <label for="Q02_1"> 有り<input name="Q02" type="radio" id="Q02_1" value="0" checked> </label> <label for="Q02_2"> 無し<input name="Q02" type="radio" id="Q02_2" value="1"> </label> <label for="Q03_1"> 有り<input name="Q03" type="radio" id="Q03_1" value="0" checked> </label> <label for="Q03_2"> 無し<input name="Q03" type="radio" id="Q03_2" value="1"> </label> <label for="Q04_1"> 有り<input name="Q04" type="radio" id="Q04_1" value="0" checked> </label> <label for="Q04_2"> 無し<input name="Q04" type="radio" id="Q04_2" value="1"> </label> ・ ・ ・ ・ というようなものを用意しています。 Ａコースを選ぶと、 Q02は「有り」、Q03は「無し」、Q04は「有り」 Ｂコースを選ぶと、 すべて「有り」 Ｃコースを選ぶと、 すべて「無し」 というような、コースによってラジオボタンにチェックが入るという仕組みです。 宜しくお願い致します。

  • チェックボックスやラジオボタンでの計算

    チェックボックスや、ラジオボタンで、選択した項目の金額を、最後にテキストフォームに表示させる…というやり方を探しております ソース途中からですが…↓ <tr> <Td Valign="middle" Width="80">部数選択</td> <Td Align="center" Valign="middle"><必須></td> <Td> <Input Type="radio" Name="pay" Value="100部　10000円">100部　￥10,000円<Br> <Input Type="radio" Name="pay" Value="150部　20000円">150部　￥20,000円<Br> <Input Type="radio" Name="pay" Value="200部　30000円">200部　￥30,000円<Br> <Input Type="radio" Name="pay" Value="300部　40000円">300部　￥40,000円<Br> <Input Type="radio" Name="pay" Value="300部以上　※お見積もりいたします">300部以上　※お見積もりいたします<Br> </td> </tr> <tr> <Td Valign="middle" Width="80">オプション選択<Br>（複数選択可）</td> <Td Align="center" Valign="middle"><必須></td> <Td> <Input Type="checkbox" Name="op[]" value="地図を入れる">地図を入れる<Br> <Input Type="checkbox" Name="op[]" value="先生のプロフィールを入れ">先生のプロフィールを入れる<Br> <Input Type="checkbox" Name="op[]" value="ごあいさつを入れる">ごあいさつを入れる<Br> <Input Type="checkbox" Name="op[]" value="生徒募集中を入れ">生徒募集中を入れる<Br> <Input Type="checkbox" Name="op[]" value="写真を入れる">写真を入れる<Br> <Input Type="checkbox" Name="op[]" value="ゲスト紹介">ゲスト紹介<Br> <Input Type="checkbox" Name="op[]" value="ＱＲコード">ＱＲコード<Br> </td> </tr> といった感じです。 value　はすでに、他のところで使用しています 単純に計算だけを目的とさせているんですが、どうしたら良いでしょうか？

  • チェックボックスの複数選択の値をCGIで取得する方法

    お世話になります。 表記の通りチェックボックスで複数選択するHTMLを次のように作成しました。 ======== 送信元HTML ========= <FORM action='******.cgi' method='POST'> <INPUT type='checkbox' name='Q6_ans' value='1'> <INPUT type='checkbox' name='Q6_ans' value='2'> <INPUT type='checkbox' name='Q6_ans' value='3'> <INPUT type='checkbox' name='Q6_ans' value='4'> <INPUT type='checkbox' name='Q6_ans' value='5'> <input type=submit value='実　　行'> </FORM> これを受取るPerl-CGIのコードをこうしました。 ======== 受信するcgi ========= my @files_2 = split(/\0/,$in{'Q6_ans'}); for($i=0;$i<=4;$i++){ if($files_2[$i] ne ""){$d[6].=$files_2[$i]." , ";} } 例えばチェックボックスで２と３を選ぶと$d[6]の値は「２ , ３ ,」となるつもりだったんですが、意に反し「２３ ,」となります。 配列の値を調べると$files_2[0]に「２３」が代入されて、$files_2[1]から$files_2[4]は空です。つまり「split(/\0/,$in{'Q6_ans'})」での分割がされていないようなのです。 何が原因で、どこが間違いなのでしょう。チェックボックスの値は\0で区切られていると思っているのですが、間違いでしょうか？

  • ラジオボタン

    htmlで質問です。 input typeのラジオボタンを横並びにしたいのですがどうすればできますか？ <div class="form-item"> <label for="sex"></label> <input type="radio" name="sex" value="男"><i class="fas fa-mars man"></i></input> <input type="radio" name="sex" value="女"><i class="fas fa-venus woman"></i></input> </div>

    • ベストアンサー
    • HTML
  • チェックボックスの値取得後の加工について

    下記のJavaScriptをどうように修正をすれば良いか、 ご教授いただければと思い投稿させて頂きました。 どうぞよろしくお願い申し上げます。 出力ボタンをクリックすると現状では下記のようになります。 【現状】 ------------------------------------------------------ アンケート結果 　→回答1 　→回答2 希望としては取得した値を下記のように加工をして出力したいと思います。 【希望】 ------------------------------------------------------ アンケート結果 　→回答1、回答2 【ソース】 ------------------------------------------------------ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN Frameset" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <script> function textoutput(formObj) { var checkbox01 = formObj.elements["C01"]; var text = 'アンケート結果' + '\n'; for ( var i = 0; i < checkbox01.length; i ++ ) { if ( checkbox01[i].checked === true ) { text += checkbox01[i].value; text += '\n'; } } formObj.elements["output"].value=text; } </script> </head> <body> <form name="form01"> <strong>・回答結果</strong><br> <table border="0"> <td colspan="2" valign="middle" width="560"> <input type="checkbox" name="C01" value="　→回答1" id="checkbox1-1"> <label for="checkbox1-1">回答1</label> <input type="checkbox" name="C01" value="　→回答2" id="checkbox1-2"> <label for="checkbox1-2">回答2</label> </td> <table> 結果出力<br> <input type="button" value="ログ出力" onClick="textoutput(this.form);"><br> <textarea name="output" id="output" cols="60" rows="10"></textarea><br> </form> </body> </html>

  • ラジオボタンとプルダウンを連動させたい

    ラジオボタンとプルダウンを連動させたい いつもお世話になっております。 ラジオボタンのvalue値に連動してプルダウンの内容が変わるということがしたいと思い、 数日前からいろいろと格闘していましたが、煮詰まったため相談に伺いました。 http://okwave.jp/qa/q2928590.htmlのANo.2の回答 -------------------------------------------------------------------- <script language="javascript"> function changeFunc(obj){ var v=obj.value; var f=obj.form; for(var i=0;i<f.length;i++){ if(f[i].type=="checkbox"){ if(f[i].className==v || v=="") f[i].disabled=false; else f[i].disabled=true; } } } </script> <form> <select name="genre" onChange="changeFunc(this)"> <option value="">食べ物</option> <option value="grain">穀物</option> <option value="fruit">果物</option> <option value="meat">生き物</option> </select> <br /> <input type="checkbox" value="お米" class="grain">お米<br /> <input type="checkbox" value="そば" class="grain">そば<br /> <input type="checkbox" value="りんご" class="fruit">りんご<br /> <input type="checkbox" value="みかん" class="fruit">みかん<br /> <input type="checkbox" value="さかな" class="meat">さかな<br /> <input type="checkbox" value="豚肉" class="meat">豚肉 </form> -------------------------------------------------------------------- を参考にいろいろと試してはみたのですが、こちらは「プルダウン→チェックボックス」で、 まったく逆でどうしたら良いのかまったくわかりませんでした。 他のウェブサイトの情報やサンプルも試したのですが、value値やname値他の問題でうまくできませんでした。 希望の仕様は ・ラジオボタンの選択肢によって、プルダウン（セレクトボックス）の内容が変わる（アイテムが消える、または選択できなくなる）。 ・ラジオボタン・プルダウン共にvalue値・name値は決まったものがある（プルダウンのvalue値は日本語） 以上です。 javascriptは素人ですので、わかりにくい質問になっているかもしれないのですが、お力を貸していただけましたら助かります。 よろしくお願いします。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する