[スクリプトの概要]
生年月日を入力して、計算ボタンを押すと、17歳+〇日という形で、日数を計算します。

  1. //=============================================================================
  2. //
  3. // GkSeventeen.js JAVAScript 17歳+〇日計算
  4. //            Programmed by G.K.2018
  5. //
  6. //=============================================================================
  7. //変数の宣言===================================================================
  8. var canvas; //キャンバスオブジェクト
  9. var ctx; //描画コンテキスト
  10. var winWidth = 600; //CANVASの横幅
  11. var winHeight = 400; //CANVASの高さ
  12. var now_year; // 現在の年月日 数値
  13. var now_mon;
  14. var now_days;
  15. var now_date; // 2018/06/30形式の現在の日付
  16. var base_date; // 〃       17歳誕生日の日付
  17. //関数の宣言========================================================================
  18. //初期化:年選択のオプション追加-------------------------------
  19. function initSelect_Year() {
  20. // 現在の年を取得
  21. var now = new Date();
  22. now_year = now.getYear() + 1900;
  23. now_mon = now.getMonth();
  24. now_days = now.getDate();
  25. // 年入力ボックスのメニュー項目のセット-----
  26. var selectId = document.form1.bdYear;
  27. for (var i = now_year-100; i < now_year+1; i++)
  28. {
  29. element = document.createElement('option');
  30. element.setAttribute('value', i);
  31. element.innerHTML = i;
  32. selectId.appendChild( element );
  33. }
  34. // 現在の年を選択状態にする
  35. selectId.options[100].selected = true;
  36. // 月入力ボックスのメニュー項目のセット-----
  37. selectId = document.form1.bdMonth;
  38. for (var i = 1; i < 12; i++)
  39. {
  40. element = document.createElement('option');
  41. element.setAttribute('value', i);
  42. element.innerHTML = i;
  43. selectId.appendChild( element );
  44. }
  45. // 現在の月を選択状態にする
  46. selectId.options[now_mon].selected = true;
  47. // 日入力ボックスのメニュー項目のセット-----
  48. selectId = document.form1.bdDay;
  49. // メニュー項目のセット
  50. for (var i = 1; i < 32; i++)
  51. {
  52. element = document.createElement('option');
  53. element.setAttribute('value', i);
  54. element.innerHTML = i;
  55. selectId.appendChild( element );
  56. }
  57. // 現在の日を選択状態にする
  58. selectId.options[now_days].selected = true;
  59. }
  60. //初期化処理-------------------------------------------
  61. function init() {
  62. //描画コンテキストの取得
  63. canvas = document.getElementById("mainCanvas");
  64. if ( ! canvas || ! canvas.getContext ) { return false; }
  65. ctx = canvas.getContext('2d');
  66. initSelect_Year(); //年月日選択オプションの初期化
  67. ctx.clearRect(0, 0, 600, 400); //画面のクリア
  68. }
  69. //計算実行--------------------------------------------
  70. function execCulc() {
  71. ctx.clearRect(0, 0, 600, 400); //画面のクリア
  72. ctx.font = "22px 'MS Pゴシック'"; //表示フォントの設定
  73. //誕生日の文字列--------------------------------
  74. var selectId = document.form1.bdYear;
  75. var num = selectId.selectedIndex;
  76. var str_year = selectId.options[num].value;
  77. selectId = document.form1.bdMonth;
  78. num = selectId.selectedIndex;
  79. var str_mon = selectId.options[num].value;
  80. selectId = document.form1.bdDay;
  81. num = selectId.selectedIndex;
  82. var str_days = selectId.options[num].value;
  83. var str_birthday = str_year + "年" + str_mon + "月" + str_days + "日";
  84. ctx.fillText("あなたの誕生日:", 30, 50);
  85. ctx.fillText(str_birthday, 230, 50);
  86. //現在の日付の文字列---------------------------
  87. var str_nowdate = now_year + "年" + (now_mon + 1) + "月" + (now_days + 1) + "日";
  88. ctx.fillText("今日の日付:", 30, 100);
  89. ctx.fillText(str_nowdate, 230, 100);
  90. //現在の年月日を作成
  91. var now_mon2 = Number(now_mon) + 1;
  92. var now_days2 = Number(now_days) + 1;
  93. now_date = now_year + "/" + now_mon2 + "/" + now_days2;
  94. ctx.fillText("↓↓↓", 50, 150);
  95. //17歳を超えているか判定----------------------
  96. var tmp_year = Number(str_year) + 17;
  97. var result1 = 0;
  98. if(tmp_year < now_year) {
  99. result1 = 1; //年が達していない
  100. }
  101. else {
  102. if(tmp_year == now_year) { //年は達している
  103. if(str_mon < now_mon + 1) { //月が達していない
  104. result1 = 1;
  105. }
  106. else {
  107. if(str_mon == now_mon + 1) { //月は達している
  108. if(str_days <= now_days + 1) { //日が達していない
  109. result1 = 1;
  110. }
  111. }
  112. }
  113. }
  114. }
  115. //計算結果表示
  116. if(result1 == 0) {
  117. ctx.fillText("まだ17歳になっていない。", 30, 200);
  118. }
  119. else {
  120. //17歳の誕生日の年月日を作成
  121. var str_mon2 = Number(str_mon);
  122. var str_days2 = Number(str_days);
  123. base_date = tmp_year + "/" + str_mon2 + "/" + str_days2;
  124. var diffDays = culcDiffDays(); //日付差分を計算
  125. ctx.fillStyle = "blue";
  126. ctx.fillText("あなたの年齢は:", 30, 200);
  127. ctx.fillText("17歳+" + diffDays + "日", 230, 200);
  128. ctx.fillStyle = "black";
  129. }
  130. }
  131. //日付の差分を計算------------------------------------
  132. function culcDiffDays() {
  133. var diffDays = 0;
  134. var Date1 = new Date(now_date);
  135. var Date2 = new Date(base_date);
  136. diffDays = Math.ceil((Date1 - Date2) / 86400000); //1日は86400000ms
  137. return diffDays;
  138. }
  139. //最初に実行------------------------------------------
  140. function main(){
  141. init();
  142. //draw();
  143. }
  144.  

[ファイルのダウンロード]
17PlusDays.zip

サンプルを表示
ウィンドウを閉じる
トップに戻る