期間を表示させる組み方を教えてください。

このQ&Aのポイント
  • 期間を表示させる方法について教えてください。具体的には、2010年10月30日から2010年11月5日までの間を表示させる方法を求めています。
  • HTML内にJavaScriptコードを埋め込むことで期間を表示させることができます。具体的なコード例として、以下のようなスクリプトを使用します。
  • 外部スクリプトにkei変数を用意し、Kikan関数に引数として日付を渡すことで、期間を表示させることができます。また、現在の日付を取得してkeiの数値を足すことで、期間の終了日を計算し表示させることも可能です。
回答を見る
  • ベストアンサー

期間を表示させる組み方を教えてください。

期間を表示させる組み方を教えてください。 java script初心者です。 ホームページ上に 2010年10月30日~2010年11月5日 計7日 とjava scriptで表示させたいとします。 html内に <script language="JavaScript" type="text/javascript"> <!-- Kikan("2010/10/30"); //--> </script> と埋込,このデータを読込んでココに上記のように表示させる ソースの組み方のお知恵をお借りしたいのです。 外部スクリプトに kei=7; function Kikan(hizuke) { mykikan=new Array(); mykikan=hizuke.split("/"); dat= mykikan[0] + "年" + mykikan[1] + "月" + mykikan[2] + "日" } document.write(dat + "&nbsp;計" + kei + "日"); とすればとりあえず 2010年10月30日 計7日 という表示が出来るところまでは理解できたのですが そのあとKikanにkeiを足して 2010年10月30日~2010年11月5日 計7日 と表示させるにはどのようにすると良いのでしょうか。 参考書見ながら現在の日にちを取得して比較させkeiの数値を足すのではないかと 考えはするのですが始めたばかりでまだ知恵が足りません。 よろしくお願いいたします。

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

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.4

既に回答が出てますが… Dateは結構そのまま計算できたりします。 今回の場合は、指定日から(kei-1)日後の日付を取得すればよいので、  date.setDate(date.getDate() + kei -1) みたいにすれば、○日後を得ることができます。 ご質問の仕様のままとして、 (外部ファイル) var Kikan = (function(z) { var kei = 7; return function(hizuke) { var date0 = new Date(hizuke), date1 = new Date(hizuke); date1.setDate(date1.getDate() + kei -1); document.write(z(date0) + "~" + z(date1) + " " + kei + "日間"); }; })(function(d) { return d.getFullYear() + "年" + (d.getMonth() + 1) + "月" + d.getDate() + "日"; });

yadorokun
質問者

お礼

こちらの組み方だと,とてもシンプルになるのですね。 同じ表示で違う組み方があると勉強になるので とても助かりました。 ありがとうございます。

その他の回答 (3)

  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.3

気付かれないうちに修正 function Kikan(hizuke,kei){ var hizukes = hizuke.split("/"); var from_day = new Date(hizukes[0]*1,hizukes[1]*1-1,hizukes[2]*1); var to_day = new Date(from_day.getTime() + kei*24*60*60*1000); var mystr = from_day.getFullYear() + "年"     + (from_day.getMonth()+1) + "月"     + from_day.getDate() + "日"     + "~"     + to_day.getFullYear() + "年"     + (to_day.getMonth()+1) + "月"    + to_day.getDate() + "日"    + "&nbsp;計" + kei + "日"; return mystr; }

yadorokun
質問者

お礼

参考書見ながら考え方をソースに当てはめると こうなるのかと解りやすく とても助かりました。 同じ表示でも組み方が色々あるのですね。 参考にさせていただきます。 ありがとうございます。

  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.2

あれっ  .getMonth() は1月が0で、12月が11のはずだったのに....

  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.1

関数kikan()は↓のようにして(行の先頭の全角空白は半角空白にしてね) function Kikan(hizuke,kei){  var hizukes = hizuke.split("/");  var from_day = new Date(hizukes[0],hizukes[1],hizukes[2]);  var to_day = new Date(from_day.getTime() + kei*24*60*60*1000);  var mystr = from_day.getFullYear() + "年"       + from_day.getMonth() + "月"       + from_day.getDate() + "日"       + "~"       + to_day.getFullYear() + "年"       + to_day.getMonth() + "月"       + to_day.getDate() + "日"       + "&nbsp;計" + kei + "日";  return mystr; } 埋め込むのは <script type="text/javascript">document.write(Kikan("2010/10/30",7));</script> でよろし。

関連するQ&A

  • HTMLで一定期間文字列を表示したい

    初めまして。 Webページの更新を知らせるのに、一定期間(11月20日まで)「<更 新>」の文字を表示させようとして、以下のようなHTMLを書いたのですが、どうも「d <= 20」が影響してるみたいで20日を過ぎてテストすると、表示されません。 if文の書き方が悪いのか?カッコ記号を色々付け替えても思い通りの結果になりません。 お教えいただければ幸いです。 宜しくお願いします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> <title></title> </head> <body> <script type="text/javascript"> <!-- // 公開期間設定 today = new Date(); y = today.getFullYear(); m = today.getMonth()+1; d = today.getDate(); document.write('  ',y,'年',m,'月',d,'日<br><br>'); //--> </script> &nbsp;    ページ &nbsp;A // 更新マーク <script language="JavaScript"> <!-- if (y == 2011 && m <= 11 && d <= 20) document.write('&nbsp;<font color="#ff0000" size="2">&lt更&nbsp;新&gt</font>'); //--> </script> </body> </html>

  • □時□分の□に文字を入れる

    javaScript初心者です。よろしくお願いします。 <body> <input type="text" name="ji" />時 <script language="javascript"> hizuke = new Date(); ji.value = hizuke.getHours(); </script> 書籍を元にhtmlファイルに上記のスクリプトをかきました。上記スクリプトで現在が12時であれば 12時 と表示されると説明されているのですが上手く行きません。<inputの枠と 時 は表示されるのですが、<input>枠内には何も表示されない状態です。 上記のjavaScript内に、document.write(hizuke); を付け足して見たところ日時は表示されず、ji.value = hizuke.getHours();を削除するとdocument.write(hizuke); は表示されました。 短いコードですが何度も見返してみたのですが、どこに問題があるか分かりません。 <input>枠内にjavaScriptで取得した時間を表示するのに上記コードでの問題解決の方法やアドバイスをいただきたく思います。 よろしくお願いします。

  • JavaScriptで期間を計算したい。

    ある期間(複数)を入力したら、その合計を表示させたいのですが、 良い方法はないでしょうか。よろしくお願いします。 サンプルはこのような感じです。 ------------------- 期間1: 西暦 <input name="kikan01_01" type="text" id="kikan01_01" />年 <input name="kikan01_02" type="text" id="kikan01_02" />月 ~ 西暦 <input name="kikan01_03" type="text" id="kikan01_03" />年 <input name="kikan01_04" type="text" id="kikan01_04" />月 期間2: .... 期間3 .... 合計年数 <input name="nensuu" type="text" id="nensuu" />年 <input name="kagetsu" type="text" id="kagetsu" />ヶ月

  • これだけ外部スクリプトで動かない

    <script type="text/javascript"> <!-- kikan=4; function new4W(writeday){ if((new Date()-new Date(writeday))/(24*60*60*1000)<=kikan) document.write("<img src='/img/ic/new036.gif'>"); } // --> </script> <script>new4W("2008/03/16")</script> 指定した日付(この場合 2008/03/16)から4日間、 画像を表示させるものです。<body>~</body>でちゃんと動きます。 <SCRIPT LANGUAGE="JavaScript" SRC="http://~/js/newmark.js"></SCRIPT> <script>new4W("2008/03/16")</script> 外部スクリプトにしました。そのまま内容を移行しましたが動きません。 呼び出しの部分を <head>~</head>に挿入しても、それでも動きません。 指定を絶対パス・相対パスいづれでも動きません。 これとは別に「3月18日は○○さんの誕生日です」なる JavaScript を 外部から引いてますが、こちらは問題なくできています。 指定URLも直接移動で内容が表示されるのを確認しました。 どうかご指導いただければと思います。よろしくお願いします。

  • undefinedが表示されてしまう

    URLからクエリを取得し、そのクエリを表示するJavaScriptを書きました。 例えば、 http://www.hoge.com/hoge.html?hoge=moge にアクセスすると、画面上に 「hoge=moge」 と表示されます。 スクリプトコードは以下のようになっています。 <script type="text/javascript"> QueryString = location.search.split("?"); if ( QueryString.length > 0 ) { document.write(QueryString[1]); } </script> ところが、 http://www.hoge.com/hoge.html http://www.hoge.com/hoge.html? などのクエリがないURLにアクセスすると、 「undefined」 が表示されてしまいます。 これでは都合が悪いです。 undefinedを表示させないように(何も表示させないように)するにはどうすればいいでしょうか? 使用環境はWindows7/Chromeです。 よろしくお願いします。

  • EXCELのセルに変数を入れて任意の期間を串刺し計算したい

    例えば5月2日から6月10日までのシートを串刺し計算するときは合計シートにSUM("5月2日":"6月10日"!k7)のように入れれば動くのですが、インプットボックスを使って初めと終わりのシートを指定するだけで合計シートに表示できるようにできないでしょうか。 例えばInputBoxでFromとTooを指定したとします。 SUM(Kikan(From,Too)!k7) →エラーになります 以下は標準モジュールに書いてあります Public From, Too as string Function Kikan(From, Too) Kikan = From + ":" + Too End Function

  • コピーライトの年表示について教えて下さい。

    HTMLのフッター部分に <script type="text/javascript" language="JavaScript">  ShowNowYear(); </script> を使ってコピーライトの年表示をしています。 現在は2008年なので「2008」と表示されますが、 2009年以降は「2008-2009」とするにはどうしたら いいでしょうか? 色々と調べてみたんですが、なかなかいい解決法が 見つかりませんでしたTT よろしくお願いします。

  • java scriptで読み込むtxtでリンクする

    java scriptを使って外部テキストデータをhtml内に表示させることはできたのですが、そのテキストからさらに別ページへのリンクを貼る方法はあるでしょうか? ■java script内 var data = [ [2010.12.12,ここにコメント], [2010.11.11,'ここにコメント'], [2010.10.10,'ここにコメント'] ]; ※ここにコメントの全文または一部分をリンクさせたいです。 ■html内 <script type="text/javascript" src="data.js"></script> <script type="text/javascript"> for(var i=0;i<data.length;i++) document.write(data[i][0]+'&nbsp; &nbsp;'+data[i][1]+'<br>'); </script> よろしくお願いします。

  • 小数点になってしまいます。

    <html> <head> <title>test</title> </head> <body> <scriptlanguage="javascript"> <!-- vardat1=newDate(2016,6,1); vardat2=newDate(2016,11,31); vardiff=(dat2.getTime()-dat1.getTime())/(1000*1900/02/28*1900/02/28*24); document.writeln(diff+'日の差'); //--> </script> </body> </html> これなら、問題なく日付けが表示されるのですが <html> <head> <title>test</title> </head> <body> <scriptlanguage="javascript"> <!-- vardat1=newDate(); vardat2=newDate(2016,11,31); vardiff=(dat2.getTime()-dat1.getTime())/(1000*1900/02/28*1900/02/28*24); document.writeln(diff+'日の差'); //--> </script> </body> </html> これにすると小数点になってしまいます。 vardat1=newDate();でも 年末までの残り日数を ブラウザ上に表示するには どうすれば良いでしょうか?

  • Javascriptでカレンダー表示

    営業日カレンダースクリプトというサイトがあります。 http://www.calenderdayo.com/ このスクリプトを利用したとき、今日の日付が3月31日の時、翌4月以降のカレンダーの表示がおかしくなるときがあります。 3/30では表示はおかしくありません。4/1でもおかしくありません。現在確認できているのは3/31の時だけです。 具体的には4月の開始日が2009/4/1なら水曜日から始まらなければならないところが金曜日から始まっています。 制作者に連絡をしたくても、サイトに記述がないので連絡できませんでした。 Javascriptには詳しくないので、一応ソースを追ってみたりしたのですがよくわかりませんでした。 お解りの方がいれば、よろしくお願いします。

専門家に質問してみよう