如何使用javascript计算html中的日期差异而不单击提交按钮

时间:2014-06-27 07:54:13

标签: javascript html

我在表单中手动给出两个日期之后,另外一个空框就是日期差异应该使用java脚本动态地计算第三个框中的天数 对我来说,当我点击提交按钮并使用提交按钮属性时我正在工作,但我希望它应该在第二个日期输入第二个日期后得到计算,它应该显示在第三个框中这里是我的代码.... 请帮帮我..

脚本

   function dateDiff() {
    date1 = new Date();
    date2 = new Date();
    diff = new Date();
    date1temp = new Date(dateform.firstdate.value);
    date1.setTime(date1temp.getTime());
    date2temp = new Date(dateform.seconddate.value);
    date2.setTime(date2temp.getTime());
    diff.setTime(Math.abs(date1.getTime() - date2.getTime()));
    timediff = diff.getTime();
    days = Math.floor(timediff / (1000 * 60 * 60 * 24));
    dateform.difference.value = days;
    return false;
   }

HTML

<form>
    <fieldset>
        <label for="Enter leave starting date">Enter leave starting date
            <input type="text" name="firstdate" />
        </label>
        <label for="Enter leave ending date">Enter leave ending date
            <input type="text" name="seconddate" onkeyup="return dateDiff();" />
        </label>
       <label>
         Date Difference (in days):  <input type=text name=difference>
      </label>
    </fieldset>
</form>

1 个答案:

答案 0 :(得分:3)

实际上,代码有效......你唯一需要的就是给表单提供你在脚本中使用的名称

<form name="dateform">

....我在你的小提琴上测试它,它就像一个魅力:http://jsfiddle.net/byJKg/5/ ......你可能想检查一下这个日期是不是NaN

if(!isNaN(days)){
   dateform.difference.value = days;
}

[编辑] ...我刚刚看到它不是你的小提琴....但是Felix Lahmer发布的小提琴,带有你的源代码