JavaScriptのフォーム内のvalueの設定について

2023/08/11 02:41

このQ&Aのポイント

JavaScriptを使用して、フォーム内のvalueの値を変数で取得する方法について教えてください。
現在の月を取得し、その値を用いてラジオボタンのvalueを設定したい場合、どのようなコードを記述すればよいでしょうか。
ラジオボタンのvalueに変数を設定する方法について、具体的なコード例を教えてください。

ベストアンサー

JavaScriptのフォーム内のvalueの設定

2011/02/20 01:14

フォーム内のvalueの値を、変数で取得することはできますか？まず var date = new Date(); //現在の月の取得 var mon = date.getMonth() + 1; として、monに今月の月を入れます。そしてラジオボタンを用意し document.write('<input type="radio" name="mouth" value=○○>'+mon+'月'); document.write('<input type="radio" name="mouth" value=○○>'+(mon+1)+'月'); document.write('<input type="radio" name="mouth" value=○○>'+(mon+2)+'月'); document.write('<input type="radio" name="mouth" value=○○>'+(mon+3)+'月'); 上記の○○の部分にそれぞれ、mon、mon+1…の値が入るようにしたいのです。 value=monとすると、そのまま「mon」という文字を取ってしまいます。どなたか教えていただければ幸いです。

ichinose_kaoru
お礼率50% (1/2)

JavaScript
回答数1
ありがとう数1

みんなの回答 （1）
専門家の回答

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

ベストアンサー

LOHA
ベストアンサー率52% (203/388)

2011/02/20 11:30 回答No.1

普通に足せば良いのでは？ document.write('<input type="radio" name="mouth" value="' + mon + '">'+mon+'月');

質問者

お礼 2011/02/20 23:36

ありがとうございました！単純な内容でしたね…。プログラミングなんて学生時代に遊びでやってた程度なのに会社でシステムを作らないといけないことになり基本が抜け落ちまくった状態でやってますので…（汗）でも、助かりました！

関連するQ&A

javascriptで質問
javascript初心者です。日付で自動的に変わるようなメニューが作りたいのですがもっとシンプルに簡潔にできますか？また、開いているページのタブの色を他と変えたいのですができますか？以下ソース↓ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>スクリプトテスト</title> <style type="text/css"> .menu li{ list-style-type:none; float:left; border:solid 1px #666666; } .menu li a{ padding:5px; background:#eeeeee; display:block; } .menu li a:hover{ background:#ffffff; } </style> <script type="text/javascript">  </script> </head> <body> <ul class="menu"> <script type="text/javascript">  </script> <script type="text/javascript">  </script> <script type="text/javascript">  </script> <script type="text/javascript">  </script> <script type="text/javascript">  </script> <script type="text/javascript">  </script> <script type="text/javascript">  </script> </ul> </body> </html>
- 締切済み
- JavaScript
hiddenフォームのvalueを自動生成したいのですが...
JavaScriptで生成した値を、同じページの中にあるinput type=hiddenフォームのvalueの値として使用したいのですが、うまく行きません。普通のinputタグであれば、 <SCRIPT Language="JavaScript">  </SCRIPT> <BODY onLoad="SetOrderId()"> <INPUT NAME="OrderId" TYPE="TEXT" onClick="SetOrderId()"> で、ページを開いたときにOrderIdフォームに値が代入されているのですが、 <input type=hidden name="OrderId"> としたときには、上記のスクリプトで生成した値がinput type=hiddenのvalueに設定されず、困っています。どうすればinput type=hiddenのvalueの値にJavaScriptで生成した値を代入できるのでしょうか？
- ベストアンサー
- JavaScript
javascriptについて
<script type="text/javascript">  </script> </head> <body> <form action="#" method="POST" name="ad"> <h4>毎日歯を磨きますか？</h4> <p><input type="checkbox" name="y" value="">はい<br> <input type="checkbox" name="n" value="">いいえ</p> <h4>何回</h4> <p>1回<input type="radio" name="a" value=""><br> 2回<input type="radio" name="a" value=""><br> 3回<input type="radio" name="a" value=""></p> <p>何<input type="text" size="20" name="ad1">点</p> <p><input type="button" value="配点" onClick="df()"> <input type="reset" value="リセット"></p> </form> </body> </html> プログラムとしては成功しているんですが解らないところが for(var i=0;i<3;i++) のところです。ラジオボタンに添え字を使って計算をしているというプログラムなのでしょうがたとえばlengthではなくあえて数字を入れてるのは配列ではないからでしょうか？もう一点 formをつかって button やimage　などを使うと間違いを指摘してもデーターが流れて言ってしまいます。 return falseなど工夫はしてますがデーターをtextに入っている文面を消さずに修正させるいい方法はありませんかお願いします。
- ベストアンサー
- JavaScript
javascriptを使ったフォームをCGIで取得できない
フォームに名前、フリ仮名、性別（ラジオボタン）、生年月日（選択メニュー）があり、下記は確認ページで、javascriptを使って、表示されます。でもCGI（以下にあります）では名前のみ取得できあとの値は表示されません。どうすればよいでしょうか ---- <html lang="ja"> <head> <script type="text/javascript"> </script> </head> <body onLoad="Cng();"> <form name="kuser" action="./5-2.cgi" method="post" enctype="text/plain"> 氏名：　　　　<input type="text" name="kname" value="" size="30"><br><br> ふりがな：　<input type="text" name="kfurigana" value="" size="30"><br><br> 性別：　　　　<input type="text" name="ksex" value="" size="7"><br><br> 生年月日：　　　西暦 <input type="text" name="kyear" value="" size="10"> 年　　<input type="text" name="kmonth" value="" size="5"> 月　　<input type="text" name="kday" value="" size="5"> 日<br><br> <tr><td colspan="2" align="right"> 　　　　　　　　<input type="submit" value="送信"> 　　<input type="button" value="戻る"> ----- （CGI） #! c:/perl/bin/perl # フォームデータの取得 if($ENV{'REQUEST_METHOD'} eq 'POST') { read(STDIN, $query, $ENV{'CONTENT_LENGTH'}); } else { $query = $ENV{'QUERY_STRING'}; } foreach $pair (split(/&/, $query)){ ($key, $value)=split(/=/, $pair); $value=~tr/+/ /; $value=~s/%([0-9a-fA-F][0-9a-fA-F])/chr(hex($1))/eg; $FORM{$key}=$value; } # サーバー出力 print <<END; Content-type: text/html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html> <head><title>ふぉーむでーた</title></head> <body> <h1>フォームデータ</h1> <table border="1"> <tr><th>フォーム要素</th><th>データ</th></tr> END foreach $key (keys %FORM){ print "<tr><th>$key</th><td>$FORM{$key}</td></tr>\n"; } print <<END; </table> </body> ---
- 締切済み
- JavaScript
Javascriptで複数のフォームを連結したい
初めまして、お世話になります。 Javascriptで複数のフォームを連結したいと考えています。やっと２つのテキストエリアを連結させるところまで出来るようになりました。やりたいことは、出力させるときに下記のようにしたいのですが、どのようにすれば良いかご教授いただけば幸いです。テキストエリア：text01とtext02を連結させて出力させる時に、 text01とtext02の間に”改行コード”を追加したいのです。それとラジオボタンで選択をした値を取得するための、スクリプの記述方法もご教授頂けないでしょうか？また、可能であればテキストエリア：outputに出力するときうに、下記のように出来ると希望通りの操作が出来助かります。 HTMLを勉強し始めたばかりの初心者ですが、どうぞ何卒よろしくお願い申し上げます。出力結果： ----------------------------------------------------------------------- 【入力欄１】改行コード text01 改行コード【入力欄2】改行コード text02 改行コード【ラジオボタン】 A01 改行コードソース： ----------------------------------------------------------------------- <html> <head> <script language="JavaScript">  </script> </head> <body> <form name="form01">  入力欄1<br> <textarea name="text01" cols="60" rows="10"></textarea><br>  入力欄2<br> <textarea name="text02" cols="60" rows="10"></textarea><br>  <strong>・　OS確認</strong><br /> <input type="radio" name="A01" value="・OS　⇒　XP" id="radio1-1" > <label for="radio1-1">XP</label> <input type="radio" name="A01" value="・OS　⇒　Vista" id="radio1-2"> <label for="radio1-2">Vista</label> <input type="radio" name="A01" value="・OS　⇒　Win7" id="radio1-3"> <label for="radio1-3">Win7</label> <input type="radio" name="A01" value="・OS　⇒　Mac" id="radio1-4"> <label for="radio1-4">Mac</label> <input type="radio" name="A01" value="・OS　⇒　" id="radio1-5"> <label for="radio1-5">その他</label> <br />  ログ出力<br> <input type="button" value="ログ出力" onClick="textoutput();"><br> <textarea name="output" cols="60" rows="10"></textarea><br> </form> </body> </html>
- ベストアンサー
- JavaScript
javascriptで取得した値をテキストボックスに・・・
IE5.5です。 javascriptで取得した値をテキストボックスに格納したいのですが、うまくいきません。 <SCRIPT language="javascript"> var varVal=true </script> <form> document.write("<input type='hidden' name='myVal' vaue="+varVal+">"); </form> javascriptが初心者でよくわからないのですが、例えば <input type="hidden" name="myVal" value=varValに格納された値> といった書き方もできるのでしょうか？よろしくご教授願います。
- ベストアンサー
- JavaScript
JavaScript フォームでのラジオボタン制御
JavaScript初心者です。 <input name="sample1" value="左ラジオボタン" checked="checked" type="radio"> 左ラジオボタン <input name="sample1" value="右ラジオボタン" type="radio">右ラジオボタン右ラジオボタンをクリックした場合に下記のラジオボタンをクリックできる <input name="sample2" value="1" type="radio">1 <input name="sample2" value="2" type="radio">2 <input name="sample2" value="3" type="radio">3 <input name="sample2" value="4" type="radio">4 上記のように右ラジオボタンにチェックした時だけ1～4のラジオボタンをクリックできるように制御したいのですがどのように書いて言ったらいいのか困っています。 $(function() { $("[name='sample1']").click(function(){ var num = $("[name='sample1']").index(this); if(num == 1){ $("[name='sample1']").attr("disabled", false); } else { $("[name='sample1']").attr("disabled", true); } }); }); 上記のようにしてみたのですがここからどう下のラジオボタンを操作させるようにしていったらいいのかわかりません。詳しい方どなたかご教示頂けないでしょうか？宜しくお願い致します。
- ベストアンサー
- JavaScript
フォームのvalueを変更する方法
下記はjavaScriptで書いたものですが、javaScriptが有効になっていないと機能しないので perlで同じことをやりたいのですが、フォームのvalueを変更する方法とinnerHTMLの様なボタンをクリックするとテキストを変更する方法が分かりません。ヒントでも良いので教えていただけませんか？ <HTML> <HEAD><SCRIPT language="JavaScript">  function nextB(){ var data = document.formB.data.value; data++; document.formB.data.value = data; document.getElementById("print").innerHTML = data; } //--> </SCRIPT> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> </HEAD> <BODY> <FORM name="formA"> <input name="data" value="1"> <INPUT type="button" value="足す" onclick="nextA()"> </FORM> <FORM name="formB"> <SPAN id="print">1</SPAN> <INPUT type="button" value="足す" onclick="nextB()"> <INPUT type="hidden" name="data" value="1" > </FORM> </BODY> </HTML>
- ベストアンサー
- CGI
選択されたラジオボタンの値が取り出せない
フォームを使って普通のHTMLで記述すれば選択された値が送られてくると思うのですが、エレメントを作って次のようなやり方だと、「2」を選択したとしてもvalueが「1」しか返ってきません。どうすれば適切に値を取り出すことができるのでしょうか？ var element1 = document.createElement("span"); element1.innerHTML = "<input type='radio' name='a' value=1>"; document.body.appendChild(element1); var element2 = document.createElement("span"); element2.innerHTML = "<input type='radio' name='a' value=2>"; document.body.appendChild(element2); ～何かクリックした先でidが「a」のオブジェクトを取得し、選択されてた値を取り出したい～ var ele = document.getElementById("a"); alert(ele.value);←1しか表示されない
- ベストアンサー
- JavaScript
javascript 関数についての質問
javascriptで入力された日付を元に３０日後、４０日後、６０日後、９０日後の日付を表示したいのですが、作った関数が１回しか使えませんＴＴ（？）何回も使えるようにしたいです！初歩的な質問ですみませんが、どうすればよいでしょうか？ <html> <head> <title>ねこ</title> <script> function Kekka(days){ Yobi = new Array("日","月","火","水","木","金","土"); Date = new Date(document.form.y.value, document.form.m.value -1, document.form.d.value); d = Date.getDate(); Date.setDate(d+days); y = Date.getFullYear(); m = Date.getMonth()+1; d = Date.getDate(); w = Date.getDay(); str1 = y+"年"+m+"月"+d+"日("+Yobi[w]+"曜日)"; //土曜日か日曜日だったら次の月曜の日付もとる if(w == 0){ w = 1; Date.setDate(d+days+1); d = Date.getDate(); } else if(w == 6){ w = 1; Date.setDate(d+days+2); d = Date.getDate(); } str2 = y+"年"+m+"月"+d+"日("+Yobi[w]+"曜日)"; return str1,str2; } function CLR(){ document.form.y.value="";document.form.m.value="";document.form.d.value=""; document.form.v1.value="";document.form.v1_2.value=""; document.form.v2.value="";document.form.v2_2.value=""; document.form.v3.value="";document.form.v3_2.value=""; document.form.v4.value="";document.form.v4_2.value=""; document.form.v5.value="";document.form.v5_2.value=""; } function Test(){ Kekka(30); document.form.v1.value = str1; document.form.v1_2.value = str2; Kekka(40); document.form.v2.value = str1; document.form.v2_2.value = str2; } </script> </head> <body> てすとなう<br><br> <form name="form"> <input type="text" name="y" size="4">年 <input type="text" name="m" size="2">月 <input type="text" name="d" size="2">日 <input type="button" value="start" onclick="Test()"> <input type="button" value="CLR" onclick="CLR()"> <br><br> ３０日後：<input type="text" name="v1" size="27">→<input type="text" name="v1_2" size="27"><br> ４０日後：<input type="text" name="v2" size="27">→<input type="text" name="v2_2" size="27"><br> ６０日後：<input type="text" name="v3" size="27">→<input type="text" name="v3_2" size="27"><br> ９０日後：<input type="text" name="v4" size="27">→<input type="text" name="v4_2" size="27"><br> ３ヶ月後：<input type="text" name="v5" size="27">→<input type="text" name="v5_2" size="27"><br> <br><br> </form> </body> </html>
- ベストアンサー
- JavaScript