JavaScript中

时间:2017-03-29 04:40:16

标签: javascript html forms date elapsedtime

我正在计算经过时间的计算器,用户输入的是月,日和年。根据他们的输入和当前日期,我想计算两者之间的天数,然后显示已经过了多少年,几个月和几天。我开始制作一个表格,其中包含三个输入值" month" ," day"和"年"。然后我开始编写脚本:

function timeElapsed() {
       var timeMonth = document.getElementById("month");
       var timeDay = document.getElementById("day");
       var timeYear = document.getElementById("year");
       var currentDate = new Date();
       var elapsed = 
       document.getElementById("timeElapsed").innerHTML = elapsed;
   }
       //Event Listener
       var submitButton= document.getElementById("sButton");
    if (submitButton.addEventListener) {
        submitButton.addEventListener("click", timeElapsed, false);
    } else if (submitButton.attachEvent) {
        submitButton.attachEvent("onclick", timeElapsed);
    }

显然你可以告诉我有点停下来,因为我很难在这里离开。这是我在学校的实验室,我只是想了解如何去做。我的老师提到"请注意,您的程序必须包含将超过31的日值转换为月数的代码,以及超过12年的月数。" 我实际上完全是困惑但明白他的意思。它实际上只是理解如何实际做到这一点。它是一个网络课程,很难从教科书中理解。我在网上看了一下,但我找不到任何对我的情况有用的东西。如果你能帮助我,非常感谢你。

2 个答案:

答案 0 :(得分:1)

以下是您可以用来计算日期差异的example

function get(ID){
  return document.getElementById(ID);
}

function calculateDiff(){
  var FromYear 	= get('FromYear').value;
  var FromMonth = get('FromMonth').value;
  var FromDay 	= get('FromDay').value;

  var ToYear 	= get('ToYear').value;
  var ToMonth 	= get('ToMonth').value;
  var ToDay 	= get('ToDay').value;
	
  var date1 	= new Date(FromYear,FromMonth,FromDay);   /*Create Date Object From date*/
  var date2 	= new Date(ToYear,ToMonth,ToDay);         /*Create Date Object To date*/
  var diff 	= new Date(date2.getTime() - date1.getTime());

  get('ResultYear').value  = diff.getUTCFullYear()-1970;  /*Calculate year difference*/
  get('ResultMonth').value = diff.getUTCMonth();          /*Count month difference*/
  get('ResultDay').value   = diff.getUTCDate()-1;         /*Count day difference*/
}

calculateDiff();

var calculate = get('calculate');

calculate.onclick = function(){
  calculateDiff();
}
table input{
  width: 60px;
}
button{
  width: 80%;
  margin: 10px auto;
}
<table border="1">
  <tbody>
    <tr class="header">
      <th>&nbsp;</th>
      <th>YYYY</th>
      <th>MM</th>
      <th>DD</th>
    </tr>
    <tr>
      <th>FROM</th>
      <td><input  id="FromYear"  placeholder="YYYY" value="2017"></td>
      <td><input  id="FromMonth" placeholder="MM" value="3"></td>
      <td><input  id="FromDay"   placeholder="DD" value="18"></td>
    </tr>
    <tr>
      <th>TO</th>
      <td><input  id="ToYear"  placeholder="YYYY" value="2017"></td>
      <td><input  id="ToMonth" placeholder="MM" value="3"></td>
      <td><input  id="ToDay"   placeholder="DD" value="29"></td>
	</tr>
    <tr>
      <th colspan="4">
        <button id="calculate">Calculate</button>
      </th>
    </tr>
    <tr>
       <th>RESULT</th>
       <td><input  id="ResultYear"  placeholder="YYYY" value=""></td>
       <td><input  id="ResultMonth" placeholder="MM" value=""></td>
       <td><input  id="ResultDay"   placeholder="DD" value=""></td>
     </tr>
  </tbody>
</table>

答案 1 :(得分:0)

javascript中,您可以将当前日期视为

var currentDate = new Date();
var currentMonth = currentDate.getMonth() + 1; // as it starts from 0
var currentDay = currentDate.getDate();
var currentYear = currentDate.getFullYear();

从输入日期字段中获取值后,您需要执行一些基本的数学运算,例如

if(currentMonth < inputMonth) {
  monthBetween = inputMonth - currentMonth;
} else if(currentMonth > inputMonth) {
  monthBetween = currentMonth - inputMonth;
} else {
  monthBetween = 0;
}

以下是一些您可以玩和学习的示例代码。 https://jsfiddle.net/8pd5f3pe/1/