JavaScript関数で入力された日付から未来の日付を表示する方法
- 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>
- nekosabure
- お礼率100% (2/2)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
これがダメなのでは？ Date = new Date(document.form.y.value, document.form.m.value -1, document.form.d.value); Dateを上書きして、元のDateを破壊しています。 大文字のDateだとシステムのDateを破壊してしまうので例えば、小文字のdateを使ってみてはいかがでしょうか？ date = new Date(document.form.y.value, document.form.m.value -1, document.form.d.value); 当然、これ以降に出てくるDateはdateに書き換えてください。 d = date.getDate(); のような感じです。 あと、変数を最初に使うときはvarをつけてちゃんと宣言したほうがいいですね。こうやって変数が使える範囲(スコープと言いますが)を制限します。 var date = new Date(document.form.y.value, document.form.m.value -1, document.form.d.value); var d = date.getDate(); のような感じで。 関数の中で変数を使うときにvarで宣言しておくと関数の外からそれが見えなくなるので、多少破壊的なことを関数でやってもその影響を外に及ぼさなくなります。プログラムのどこからでも参照できるグローバル変数は便利で、その弊害を誰も教えてくれないので初心者はついつい使ってしまいますが、局所性が保証されなくなるので必要な場合を除いては使わないほうがいいです。 関数内でvarを使う場合、関数の外からその値が見えなくなるので、関数から値を帰す場合はちゃんとreturnで返して受け取らないと受け取れません。 しかも、JavaScriptは複数の返り値を持てないのでちょっと工夫が必要です。 例えば、 function Kekka(days){ ...略... var str1 = ... ...略... var str2 = ... ...略... return Array(str1,str2); } としておき、 k = Kekka(30); document.form.v1.value = k[0]; document.form.v1_2.value = k[1]; と書く方法があります。 あるいは、連想配列を使うこともできます。 function Kekka(days){ ...略... var ret = {} ret.str1 = ... ...略... ret.str2 = ... ...略... return ret; } としておき、 k = Kekka(30); document.form.v1.value = k.str1; document.form.v1_2.value = k.str2; という感じです。 あとは、日付に変換するところもtoLocaleString()でよいならわざわざ各必要ないかと...strftimeがないのが良くないとは思いますが。 というわけで、Dateを破壊していたのを修正しましょう。 また、可能ならばvarを使って変数のスコープを関数内に制限しましょう。
その他の回答 (1)
Date = new Date(document.form.y.value, …… これが原因ですね。Dateオブジェクトを上書きしてしまっているので、次にnew Dateしたときには前回作成したオブジェクトがDateに設定されており、Dateコンストラクタ関数ではなくなってしまってます。なので、Dateという変数名を変えてください。
お礼
回答ありがとうございます。！ わかりやすく、勉強になりました！。
関連するQ&A
- javascriptでフォームの値の計算
javascript1か月目の初心者です。 7つのテキストフィールドに数値を代入させて合計と平均（最後には標準偏差）を計算しようと思ってます。 以下のように考えましたが、うまくいきません。 strが文字列として？扱われてしまっているようです。 strをevalで囲んでみてもダメです。 詳しい方教えてください。 <!--スクリプト1--> <SCRIPT LANGUAGE="JavaScript"> <!-- function f_check() { if(document.F1.num1.value!=""&&document.F1.num2.value!=""&&document.F1.num3.value!=""&&document.F1.num4.value!=""&&document.F1.num5.value!="" &&document.F1.num6.value!=""&&document.F1.num7.value!=""){ str=0 for(var i = 0;i<document.F1.length;i++){ str+=document.F1[i].value; } alert('合計は'+str+"です"); avrg = (str)/document.F1.length; alert('平均は'+avrg+'です'); //ここから標準偏差の計算(略)。 } // --> </SCRIPT> <form method="post" name="F1" onSubmit="return f_check()"> 数値を入れてください<input type="text" name="num1" size="5"><br> 数値を入れてください<input type="text" name="num2" size="5"><br> 数値を入れてください<input type="text" name="num3" size="5"><br> 数値を入れてください<input type="text" name="num4" size="5"><br> 数値を入れてください<input type="text" name="num5" size="5"><br> 数値を入れてください<input type="text" name="num6" size="5"><br> 数値を入れてください<input type="text" name="num7" size="5"><br> <INPUT TYPE=SUBMIT VALUE="平均をとる"></FORM>
- 締切済み
- JavaScript
- textbox間の結合時、空白の時は、スペースを省きたい
<script type="text/javascript"> <!-- function ketugou(){ document.f.q.value=document.f.t1.value+" "+document.f.t2.value+" "+document.f.t3.value+" "+document.f.t4.value+" "+document.f.t5.value; } //--> </script> <form name="f"> キーワードを入力：<br> <input type="text" size="55" name="t1"><br> <input type="text" size="55" name="t2"><br> <input type="text" size="55" name="t3"><br> <input type="text" size="55" name="t4"><br> <input type="text" size="55" name="t5"><br> <input type="button" name="connect" value="結合" onClick="ketugou()"><br> 結合時の内容を表示：<br> <input type="txt" name="q" size="55" maxlength="255" ><br> </form> で、空白のテキストボックスの場合は、スペース（" "）なしで、 結合させたいんですが、どうしたら、良いのでしょうか？
- ベストアンサー
- JavaScript
- Javaで小数点第４までを処理したい。
現在近似曲線を算出するプログラムを自作しています。 正確に算出するところまでは到達出来たのですが、最後に小数点以下が多すぎるので、小数点第四までに抑えたいです。 しかし、小数点を処理するようなプログラムを想定していなかったので、とても困惑しております。 私が作っているプログラムはこんな感じです。 <title>近似曲線プログラム</title> <body> <form name="Form1"> <font color="red">近似曲線用プログラム</font><br><br> ・Ｘ＝<input type= "text" size="11" name="a"><input type= "text" size="11" name="b"><input type= "text" size="11" name="c"><br> ・Ｙ＝<input type= "text" size="11" name="e"><input type= "text" size="11" name="f"><input type= "text" size="11" name="g"><br> <input type= "button" value= "近似曲線の数式を算出" onclick="keisan1()"><br><br> ・標本数＝３<br><br> ・Ｘの平均値＝<input type= "text" size="11" name="i"><br> ・Ｙの平均値＝<input type= "text" size="11" name="j"><br><br> ・ΣXi<sup>2</sup>＝<input type= "text" size="11" name="k"><br> ・ΣXiYi＝<input type= "text" size="11" name="l"><br><br> ・ａ＝<input type= "text" size="11" name="m"><br> ・ｂ＝<input type= "text" size="11" name="n"><br><br> 結果<br> ・ｙ＝<input type= "text" size="11" name="o">ｘ＋<input type= "text" size="11" name="p"> </form> <script language="JavaScript"> function keisan1(){ a = document.Form1.a.value-0; b = document.Form1.b.value-0; c = document.Form1.c.value-0; e = document.Form1.e.value-0; f = document.Form1.f.value-0; g = document.Form1.g.value-0; i=(a+b+c)/3; j=(e+f+g)/3; k=(a*a)+(b*b)+(c*c); l=(a*e)+(b*f)+(c*g); m=(l-3*i*j)/(k-3*(i*i)); n=j-m*i; o=m; p=n; document.Form1.i.value = i; document.Form1.j.value = j; document.Form1.k.value = k; document.Form1.l.value = l; document.Form1.m.value = m; document.Form1.n.value = n; document.Form1.o.value = o; document.Form1.p.value = p; } </script> </body> この中で、結果のoとpの部分を、小数点第四にまでに抑えたいのです、今現在では、小数点以下が１０ケタ以上普通に出てしまいます。どちらも四ケタに抑えたいので、このプログラムに導入出来るような小数点処理のプログラムを知っている方がいらっしゃれば、是非丁寧に教えてほしいです。 よろしくお願いします。
- ベストアンサー
- JavaScript
- JavaScriptからphp関数の呼び出し
javaScriptで1秒毎にphpの関数を呼び出しているのですが、 php側で、returnしている日時が動的に表示されません。 何がいけないのか教えて頂けますでしょうか？ 色んな参考ページを見ると、phpの関数で動的に 動かせると書いてあるのですが、動的になりません。 -------------------------------------------------------- ＜jsphptest.htmlソース＞ <html> <head> <script type="text/javascript"src="jsphptest.php"></script> <script language="javascript"> <!-- function time() { //JavaScriptで日時表示 var now = new Date(); mon = now.getMonth()+1; day = now.getDate(); hou = now.getHours(); min = now.getMinutes(); sec = now.getSeconds(); year = now.getYear(); if (year < 2000) { year += 1900; } if (mon <= "9"){mon = "0" + mon;}; if (day <= "9"){day = "0" + day;}; if (hou <= "9"){hou = "0" + hou;}; if (min <= "9"){min = "0" + min;}; if (sec <= "9"){sec = "0" + sec;}; document.form1.j_tokei.value= year +"/"+ mon +"/"+ day +" "+ hou +":"+ min +":"+ sec; //PHP関数の呼び出し document.form1.p_tokei.value= php_time(); //1秒毎 setTimeout('time()',1000); } // --> </script> </head> <body onLoad="time();"> <form name="form1" mathod=post> JavaScript日時<input type="text" name="j_tokei" size=25><br> PHP日時<input type="text" name="p_tokei" size=25> </form> </body> </html> -------------------------------------------------------- ＜jsphptest.phpソース＞ <?php $str .= "function php_time(){"; $str .= "return('".date('Y-m-d H:i:s')."');"; $str .= "}"; echo $str; ?>
- ベストアンサー
- JavaScript
- 同じFunctionで、同じ計算させたいのですが
私は今、以下のようにここで教えていただいたプログラムを参考に組んでは見たものの、同じ行をいくつもコピペすると計算されなくなってしまいます。1行だけの計算でしようとするとうまく計算されるのですが・・・ <HTML> <HEAD> <TITLE> タイトルバーに表示されるテキスト </TITLE> <SCRIPT LANGUAGE="JavaScript"> <!--JavaScript function SUM(){ if(!isNaN(document.sum.text1.value) && !isNaN(document.sum.text2.value) && !isNaN(document.sum.text3.value) && document.sum.text1.value && document.sum.text2.value && document.sum.text3.value){ document.sum.text4.value = eval(document.sum.text1.value) + eval(document.sum.text2.value) - eval(document.sum.text3.value) } if( !isNaN(document.sum.text5.value) && !isNaN(document.sum.text6.value) && document.sum.text5.value && document.sum.text6.value){ document.sum.text7.value = eval(document.sum.text4.value) + eval(document.sum.text5.value) + eval(document.sum.tex6.value) } } //--> </SCRIPT> </HEAD> <BODY> <FORM NAME="sum" onSubmit="SUM();return false;"> A<INPUT TYPE="text" NAME="text1" onChange="SUM()" SIZE="10"><BR> B<INPUT TYPE="text" NAME="text2" onChange="SUM()" SIZE="10"><BR> C<INPUT TYPE="text" NAME="text3" onChange="SUM()" SIZE="10"><BR> D=A+B-C<INPUT TYPE="text" NAME="text4" onChange="SUM()" SIZE="10"><BR> E<INPUT TYPE="text" NAME="text5" onChange="SUM()" SIZE="10"><BR> F<INPUT TYPE="text" NAME="text6" onChange="SUM()" SIZE="10"><BR> G=D+E+F<INPUT TYPE="text" NAME="text7" onChange="SUM()" SIZE="10"><BR> </FORM> </BODY> </HTML>
- ベストアンサー
- JavaScript
- 【javascript】 年齢計算
初心者です。 イヌでもわかるjavascript講座(http://www.red.oit-net.jp/tatsuya/java/)より拝借して、年齢計算のプログラムをつくっています。 しかし、これでやると、閏年がない年でも、フツウに計算できてしまいますし、「32日」などでも入力できてしまいます。 これを改造して、正確でない日付を入力できないようにしたいのですが、インターネットなどを調べても、どのようにしたらよいのか、見当もつかず困っております。 お手数ですが、どのようにしたらよいのか、そしてできたら、考え方などもお教えくださいませ。 以下がそのソースです。 <HTML> <HEAD> <TITLE></TITLE> <script language="javascript"> <!-- function myAge(N){ //現在から、誕生日を引き、基準日に足す //つまり、現在から、誕生日の日にち分の時間だけ引く Today = new Date(); myBirth = new Date(1970 , 0 , document.myFormAge.myAgeD.value ); myBirth.setTime(Today.getTime()-myBirth.getTime()); //求めた年月日から基準日を引く myYear = myBirth.getUTCFullYear() - document.myFormAge.myAgeY.value; myMonth = myBirth.getUTCMonth() - (document.myFormAge.myAgeM.value - 1); if(myMonth < 0){ //月がマイナスなので年から繰り下げ myYear --; myMonth += 12; } myDate = myBirth.getUTCDate(); document.myFormAge.Age.value = ""+myYear+""; } //--> </SCRIPT> </HEAD> <BODY> <FORM name="myFormAge"> 生年月日を入力してください。 <br> <br> 年(西暦)<INPUT type="text" size="4" name="myAgeY"> 月<INPUT type="text" size="2" name="myAgeM"> 日<INPUT type="text" size="2" name="myAgeD" onKeyDown="myAge(this.form)"> <br> <br> <br> <br> <br> <INPUT type="text" size="5" name="Age">歳 </FORM> </BODY> </HTML> よろしくご教授くださいませ。
- ベストアンサー
- JavaScript
- javascriptのtextbox
こんばんは。 <html> <body> <center> <br><br> <form name="fuji"> TEXT BOX<br> <input type="text" name="tex"> </form> <SCRIPT type="text/javascript"> var i; i="ABC" document.write("<input type='button' value='↑を変数iに代入' onClick='i=(document.fuji.tex);'>"); document.write("<br><input type='button' value='表示' onClick='document.write(i);'>"); </SCRIPT> </center> </body> </html> でテキストボックスの中身を表示させたいのですが、 上手くいきません。どうすればいいのでしょうか。 また、変数を使わずに直接テキストボックスの中身を 表示させる事はできるのでしょうか。 教えてください。
- ベストアンサー
- その他（インターネット・Webサービス）
- 見よう見まねで以下のように作成してみたのですが
見よう見まねで以下のように作成してみたのですが 作動しませんでした。 （当方javascript初心者です） どこに問題があるのか、指摘してくださる方を探しています。 極めて初歩的なところで誤っているのだろうと思いますので 質問するのも恐縮なのですが・・・ どなたかよろしくお願いいたします。 ------------------------------------------ <HTML> <HEAD> <script language="JavaScript"> function calc(){ var a = document.form1.001.value; var b = document.form1.002.value; var c = document.form1.003.value; var d = document.form1.004.value; var total = a + b + c + d; document.form1.field.value = total; } </script> </HEAD> <BODY> <BR><BR> <form name="form1"> <Select name="001"> <Option value="10">case1 <Option value="20">case2 </Select>ケース <BR><BR> <INPUT size="15" type="text" name="002">number <BR><BR> <Select name="003"> <Option value="100">volume1 <Option value="200">volume2 <Option value="300">volume3 </Select>ボリューム <BR><BR> <Select name="004"> <Option value="0">N <Option value="50">size1 <Option value="100">size2 <Option value="150">size3 </Select>サイズ <BR><BR> <INPUT type="button" name="calc" value="計算" onClick="calc()"><BR><BR> <input size="15" readonly="readonly" name="field" type="text">total </form> </BODY> </HTML>
- ベストアンサー
- JavaScript
- javascriptによる計算
テキストボックス「a1～6」の値とテキストボックス「b1～6」に入力された値を足し算してテキストボックス「ｃ1～6」（例…c[i] = a[i] + b[i]）を計算するJavaScriptを作成しているのですが、結果がundefinedになってしまい上手くいきません。どうやったら動くのかどうかご教授ください。 以下ソース↓ <script language ="JavaScript"> function plus() { var intResult = 0; for (i=1; i<=6; i++){ intResult[i] = 0; if (!isNaN(document.forms["A"].all["a"+i].value) && !isNaN(document.forms["B"].all["b"+i].value)){ intResult[i] += parseInt(document.forms["A"].all["a"+i].value); intResult[i] += parseInt(document.forms["B"].all["b"+i].value); } <table border = 1> <tr> <td> <table border = 1> <tr> <td> <form name="A"> <input type = "text" size = 5 name = "a1"></input> </td> <td> <input type = "text" size = 5 name = "a2"></input> </td> <td> <input type = "text" size = 5 name = "a3"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "a4"></input> </td> <td> <input type = "text" size = 5 name = "a5"></input> </td> <td> <input type = "text" size = 5 name = "a6"></input> </form> </td> </tr> </table> </td> <td> <table boeder = 1> <tr> <input type = "button" onClick="plus()" value = "＋"></input> </tr> </table> </td> <td> <table border = 1> <tr> <td> <form name = "B"> <input type = "text" size = 5 name = "b1"></input> </td> <td> <input type = "text" size = 5 name = "b2"></input> </td> <td> <input type = "text" size = 5 name = "b3"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "b4"></input> </td> <td> <input type = "text" size = 5 name = "b5"></input> </td> <td> <input type = "text" size = 5 name = "b6"></input> </form> </td> </tr> </table> </td> </tr> </table> 答え <form name = "C"> <table border = 1> <tr> <td> <input type = "text" size = 5 name = "c1"></input> </td> <td> <input type = "text" size = 5 name = "c2"></input> </td> <td> <input type = "text" size = 5 name = "c3"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "c4"></input> </td> <td> <input type = "text" size = 5 name = "c5"></input> </td> <td> <input type = "text" size = 5 name = "c6"></input> </td> </tr> </table> </form> </body> document.C.all["c"+i].value = intResult[i]; } } </script>
- ベストアンサー
- JavaScript
- javascriptの計算結果をvalue=""に
javascriptの計算結果をフォームの中のvalue=""内部に表示し、送信できるようにしたいというのが質問の趣旨です。 記 下記の2つのファイルで、フォームから入力した数値同士の「足し算の結果」を表示できます。 （HTMLファイル下段 <p id="message"></p>の部分で表示します。） ******************************************** 【HTML】 <script language="JavaScript" type="text/javascript" src="js/culc.js"></script> <form name="f1"> <input type="text" id="text1" name="text1" size="10" maxlength="10" />+ <input type="text" id="text2" name="text2" size="10" maxlength="10" /> <input type="button" value="足す" onclick="readText()" /> </form> <p id="message"></p> ******************************************* 【JAVASCRIPT(culc.js)】 function readText() { var text1 = document.getElementById("text1"); var text2 = document.getElementById("text2"); var message = document.getElementById("message"); var str_val1 = text1.value; var str_val2 = text2.value; var sum; if (isNaN(str_val1) || str_val1 == "" || isNaN(str_val2) || str_val2 == "") { textMessage = "数値以外の文字が入っています"; } else { //sum = str_val1 + str_val2; sum = parseFloat(str_val1) + parseFloat(str_val2); textMessage = "合計は、" + sum + "です"; } message.innerHTML = textMessage; } ************************************************ 【質問】 次にこのHTMLを改造し、フォームから計算値を送信することとしました。 ************************************************ 【HTML】 <script language="JavaScript" type="text/javascript" src="js/culc.js"></script> <form name="f1"> <input type="text" id="text1" name="text1" size="10" maxlength="10" />+ <input type="text" id="text2" name="text2" size="10" maxlength="10" /> <input type="button" value="足す" onclick="readText()" /> </form> <form action="form.cgi" method="post" name="form2" id="form2"> <input type="hidden" name="plus" value="<p id="message"></p>"> <input type="button" value="送信" onClick="disableButton()" name="button1"> </form> ************************************************ 問題点 上記のように、計算結果を表示出来るはずの<p id="message"></p>を送信フォームのvalue=の直後に記載しただけなのですが、なぜか送れません。 <p id="message"></p> を独立して記載しているときは計算値をそのまま表示していたのですが、value="<p id="message"></p>"> と value= の中に記載した瞬間に単なる文字の羅列になってしまうようです。 value="<p id="message"></p>"> value='<p id="message"></p>'> value="<p id='message'></p>"> value='<p id='message'></p>'> と試してみましたが、いずれもうまきませんでした。 どのようにすれば、value="" の中に計算結果が入るか教えてください。 宜しくお願い致します。
- ベストアンサー
- JavaScript
お礼
ありがとうございます！ Dateを破壊していた→予約語みたいなものを使っていた？ とにかく正常に動作するようになりました。 他の指摘についても、参考になります。ＴＴ 丁寧な解説ありがとうございます。 回答を参考にさせていただいて、 これから精進していきたいと思います！