JavaScriptでfor文で日付表示する際に月の切り替えができない問題

このQ&Aのポイント
  • JavaScriptのfor文で日付を表示する際、月末の最終日を取得するだけでは月の切り替えができない問題があります。
  • 例えば、一週間後までを表示するアプリを作成する際、1月31日を過ぎると2月1日の表示がされず、1月32日と表示されてしまいます。
  • この問題の原因は、月の切り替えにおいて月末の日付を超えると1を足すだけでは正確な切り替えができないためです。
回答を見る
  • ベストアンサー

JS 日付表示

JavaScript for文の日付表示について JavaScriptでfor文で日付表示したい場合、月末の最終日を取得するだけでは月の切り替えができないのでしょうか? 今日から一週間後までを表示するアプリを作りたいのですが1/31を過ぎると2/1にならず1/32と表示されてしまいます。 何か間違っている所ありますでしょうか? 以下ソースコード <script type="text/javascript"><!-- var now = new Date(); var y = now.getFullYear(); var m = now.getMonth() + 1; var d = now.getDate(); console.log(now); // Thu Jan 30 2014 00:00:00 GMT+0900 (東京 (標準時)) console.log(new Date(now.getFullYear(), now.getMonth() + 1, 0)); // Fri Jan 31 2014 00:00:00 GMT+0900 (東京 (標準時)) for(i=0;i<100;i++){ document.write(y + "/" + m + "/" + (d + i).toString() + "<br>"); } // --></script> <body> </body>

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

  • ベストアンサー
回答No.4

> 回答No.3 amanojaku1 バグが在りました、年の繰り上がりが抜けてました。 下記は年の繰り上がりも考慮しています。 <script type="text/javascript"><!-- var now = new Date(); // now = new Date(2016, 12 - 1, 1); var y = now.getFullYear(); var m0 = now.getMonth(); var m = m0+ 1; var d = now.getDate(); console.log(now); console.log(new Date(now.getFullYear(), now.getMonth() + 1, 0)); var de = -1; var rest = -1; for(i=0;i<100;i++){ if(rest<=0){ if(rest==0){ m0++; d = 1; } if(m0==12){ y++; m0 = 0; } m = m0+ 1; de = new Date(y, m0 + 1, 0).getDate(); } rest = de - d; document.write(y + "/" + m + "/" + d + "<br>"); document.write(de+";"+ rest+";"+ "<br>"); d++; } // --></script>

その他の回答 (3)

回答No.3

<script type="text/javascript"><!-- var now = new Date(); var y = now.getFullYear(); var m0 = now.getMonth(); var m = m0+ 1; var d = now.getDate(); console.log(now); console.log(new Date(now.getFullYear(), now.getMonth() + 1, 0)); var de = -1; var rest = -1; for(i=0;i<100;i++){ if(rest<=0){ if(rest==0){ m0++; d = 1; } m = m0+ 1; de = new Date(now.getFullYear(), m0 + 1, 0).getDate(); } rest = de-d; document.write(y + "/" + m + "/" + d + "<br>"); document.write(de+";"+ rest+";"+ "<br>"); d++; } // --></script>

回答No.2

//21歳OLだけではちょっとなぁ //月末処理必要? var d = new Date; var n = 7; var rst = []; while (n--) {   rst.push (toStrDate (d));   d.setDate (d.getDate () + 1); } document.write (rst.join('<br>\n')); function toStrDate (d) {   return [    d.getFullYear (), d.getMonth () + 1, d.getDate ()   ].join ('/'); }

  • hok212
  • ベストアンサー率66% (100/150)
回答No.1

こんばんわ。 今日から一週間後と書かれていますが、なぜかスクリプトは100回ループしています。 とりあえず一週間分だけれあれば、次のスクリプトで可能です。 <script> now = new Date(); y = now.getFullYear(); m = now.getMonth() + 1; d = now.getDate(); theLastDate = new Date(now.getFullYear(), now.getMonth() + 1, 0); //当月末の日付 theLastDay = theLastDate.getDate(); // 当月の末日 nextMonth = m + 1; // 翌月 nextYear = y + 1; // 翌年 for(i=0;i<7;i++){ tDay = d + i; if (tDay > theLastDay) { m = nextMonth; tDay = tDay - theLastDay; if (m > 12) { y= nextYear; m = 1; } } document.write(y + "/" + m + "/" + tDay.toString() + "<br>"); } </script>

関連するQ&A

  • moment.js

    moment.js moment.jsで秒の部分(17:00:「00」)を削るにはどうしたら良いでしょうか? 以下ソースです。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>サンプル</title> </head> <body> <script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.2/moment.min.js"></script> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="moment.js"></script> <script src="fastclick.js"></script> <script> var now = moment(); console.log(now.toDate()); // Dateオブジェクトが返される // 文字列からも生成できるし var shougatsu = moment('2015-01-01'); console.log(shougatsu.toString()); // "Thu Jan 01 2015 00:00:00 GMT+0900" // もちろんDateオブジェクトからも生成できる var kodomonohi = moment(new Date('2015-05-05')); console.log(kodomonohi.toString()); // "Tue May 05 2015 09:00:00 GMT+0900" </script> </body> </html> コンソールログで表示をしているのですが何時何分何秒の「秒」の部分を非表示にしたい場合どうしたら良いでしょうか?

  • javascriptで任意の曜日に日をプラス

    javascriptで任意の曜日に日をプラスさせたいです。 ●外部 //日付取得 var nweek = new Array("日","月","火","水","木","金","土"); var now = new Date(); var nYear = now.getFullYear(); var nMonth = now.getMonth() + 1; var nDate = now.getDate(); var nweekjp = now.getDay(); //配送日計算 var now = new Date(); now.setDate(nDate+7); var yYear = now.getFullYear(); var yMonth = now.getMonth() + 1 ; var yDate = now.getDate(); var yweekjp = now.getDay(); ●実行タグ <script type="text/javascript">document.write(""+yYear+"/"+yMonth+"/"+yDate+" ");</script><script type="text/javascript">document.write(""+nweek[yweekjp]+"曜日 ");</script> で、配送までの日付を取得させているのですが、 土日の配送が月曜日になるため、土曜日の場合は、日付を2日追加、日曜日の場合は、1日追加としたいのですが、どうすればいいでしょうか。 調べても日付取得方法ばかりで、困っています。 ご存知でしたら教えて下さい。 お願いします。

  • js プログラムの意味

    javascriptなのですがこのプログラムは何をしているのでしょうか? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>サンプル</title> </head> <body> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script> var methods = ['onMouse', 'onClick', 'onTouchStart', 'onTouchMove', 'onTouchEnd', 'onTouchCancel']; var text = this; function and(method, text) { return function() { return method.apply(text, arguments); }; } for (var i = 0, l = methods.length; i < l; i++) { text[methods[i]] = and(text[methods[i]], text); console.dir(text); console.log(text); } </script> </body> </html> console.dirとconsole.logで中身を見てみるも何をしてるのかわからなくて... 推測でも構わないので何かあればお願いします。説明不足でスミマセンm(__)m

  • javascriptの外部ファイルにする方法

    HTML内の利用箇所にそのまま下記のように日付の表示を記述しているのですが、外部ファイル化するにはどうしたらよいのでしょうか。 <script language="JavaScript"> <!-- var now=new Date(); myTbl = new Array("日","月","火","水","木","金","土"); document.write(now.getFullYear(),"年" +(now.getMonth()+1)+"月" +now.getDate(),"日(" +myTbl[now.getDay()]+") "); document.write(now.getHours()+":"+now.getMinutes()+":"+ now.getSeconds()); --> </script> javascript初心者です。よろしくお願いいたします。

  • 何故、Array(3)と表示されるのでしょうか?

    いつもお世話になりありがとうございます。 下記プログラムでTaro,Jiro,Saburoと表示されないで、 Array(3)と表示されます。 どこが違うのでしょうか? ご回答のほど宜しくお願い申し上げます。 <!DOCTYPE html> <html lang = "ja"> <head> <meta charset = "utf-8"> <title>JavaScriptの練習</title> </head> <body> <script> /*console.log("Hello World!") var x=55156,y=29526,z=35489; console.log(x+y+z);*/ var family=["Taro","Jiro","Saburo"]; console.log(family); </script> </body> </html>

  • JSについて教えてください

    現在ドットインストールというサイトでJavaScriptを勉強しています 今割り勘電卓という物を作っています 完成はしていませんが以下のコードは打ち込まれた数字がきちんと取得されているかを確かめている段階です。 ですがconsole.logに表示されませんなぜでしょうか? <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <head> <body> <h1>割り勘電卓</h1> <p>支払額:<input type = "text" id = "amount"></p> <p>人数:<input type = "text" id = "num"></p> <p><input type = "button" value = "計算" onclic = "getResult();"></p> <p id = result></p> <script> function getResult(){ var amount = document.getElementById('amount').value; var num = document.getElementById('num').value; console.log(amount); console.log(num); } </script> </body> </html>

  • js getFullYear

    JavaScript getFullYearについて 以下ソースコード var makeDateString = function makeDateString(dateObject) { var intYear = dateObject.getFullYear(); var intMonth = dateObject.getMonth(); var intDate = dateObject.getDate(); var intDay = dateObject.getDay(); var strYear = intYear.toString(); var strMonth = intMonth.toString(); var strDate = intDate.toString(); var strDay = intDay.toString(); var dateString = strYear + "年" + strMonth + "月" + strDate + "日" + strDay + "曜日" ; document.write(dateString); return dateString; } getFullYear(); getMonth(); getDate(); getDay();とありますが何故、何年のところだけ「Full」と表記するのですか?

  • 毎週土曜日のみの日付を取得、プルダウンリストに表示させたい。

    毎週土曜日のみの日付を取得、プルダウンリストに表示させたい。 よろしくお願い致します。 表題の通りなのですが、Javascriptで「毎週土曜日の日付のみ」を取得して、 プルダウンリストで表示・選択させたいと考えております。 以前、任意での指定日以降(明日や明後日など)の日付と曜日を取得して、 プルダウンで表示・選択できるコード(下記のものです)を教えて頂いたのですが、 このような感じで土曜日の日付のみを表示・選択できるようになると理想です。 <script language="javascript"> //var Today = new Date(); //var d = new Date(); var Youbi = new Array( "日", "月", "火", "水", "木", "金", "土" ); /* ひと月後までを表示 */ for ( var i = 3; i < 31; i++ ){ var d = new Date(); d.setDate( d.getDate() + i ); /* 各要素を抽出(月と日は2桁で)*/ var sYer = "" + d.getFullYear(); var sMon = ( "00" + ( d.getMonth() + 1 ) ).match( /..$/ );; var sDat = ( "00" + d.getDate() ).match( /..$/ ); var sDay = Youbi[ d.getDay() ]; /* <option>を書き出し */ document.write( "<option value = '" + sYer + "年" +sMon + "月" + sDat + "日" + "'>" +sYer + "年" + sMon + "月" + sDat + "日(" + sDay + ")</option>\n" ); } </script> もしお分かりの方がいらっしゃいましたら、ご教授頂けると幸いです。 どうぞよろしくお願い致します。

  • ホームページで毎月第3日曜日を表示しその日を過ぎた

    ホームページで毎月第3日曜日の日付を表示していますが、月が替わると翌月に切り替わってしまいます。その日(当月の第3日曜日)が過ぎてから翌月の第3日曜日に切り替えたいのですが、判定方法をどなたかご存知の方がいらっしゃいましたらご伝授いただけますでしょうか? <script> var d=new Date(); d.setDate(14); for(var i=0;i<1;i++){ document.write(d.getFullYear()+"年"+(d.getMonth()+2)+"月"+(21-d.getDay())+"日 (日曜日)"); d.setMonth(d.getMonth()+1); } </script> で現在コーディングしています。 当月と翌月を出す事も考えています。 宜しくお願い致します。

  • jsで次のELEMENT_NODEを見つけたい

    しごく単純な質問かもしれませんが、検索エンジン等で捜しても見つからなかったのでご教授頂けないでしょうか?(検索の仕方が悪いかもしれません。。。) たとえば以下の簡単なjavascriptがあるとします。 <body> <div id="test1">hogehogehoge</div> <div>fugafugafuga</div> <script type="text/javascript"> var obj = document.getElementById('test1'); console.log(obj.nextSibling); </script> </body> この場合、nextSiblingで取得した値は次のテキストノードになってしまいます。 決めうちであれば以下のようにやってみたらうまくいきましたが、 なんだかなぁ~って感じです。 <script type="text/javascript"> var obj = document.getElementById('test1'); console.log(obj.nextSibling.nextSibling); </script> jQueryで言うところのsiblings()のような使い方、またはソースをご教授いただけないでしょうか?(できれば説明文も添えて頂ければ助かります) 一応jQueryのソースを読もうとしましたが、まことに恥ずかしいのですが力不足でまるで読むことができませんでした。 以上よろしくお願いいたします。

専門家に質問してみよう