Блог

Главная - Вопросы по программированию - Как рассчитать разницу дат в html с помощью Java script без нажатия кнопки отправки

Как рассчитать разницу дат в html с помощью Java script без нажатия кнопки отправки

#javascript #html

#javascript #HTML

Вопрос:

Я даю две даты вручную в форме, после этого есть еще одно пустое поле разница в дате должна вычисляться в днях в третьем поле динамически с помощью Java script для меня это работает, когда я нажимаю кнопку отправки и использую свойство кнопки отправки, но я хочу, чтобы оно было рассчитано после ввода второй даты ввторое поле, и оно должно отображаться в третьем поле, вот мой код…. пожалуйста, помогите мне здесь..

Скрипт

    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. можете ли вы поделиться скрипкой этого?

2. Итак, вам просто нужен триггер, когда вычислять разницу дат?

3. вот скрипка jsfiddle.net/lahmf/byJKg

4. да, когда мы вводим дату во второе поле, она должна динамически вычислять разницу в днях и должна отображаться в третьем поле ввода, чего я так хочу… я новичок в Java script

5. Как вы сказали, у вас есть рабочий скрипт с кнопкой отправки, можете ли вы создать jsfiddle с этим?

Ответ №1:

На самом деле, код работает…единственное, что вам нужно, это присвоить форме имя, которое вы используете в скрипте

 <form name="dateform">

…. я протестировал это на вашей скрипке, это работает как шарм: http://jsfiddle.net/byJKg/5/
… жестко, возможно, вы захотите проверить, не является ли datediff NaN

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

[править] …я только что увидел, что это была не ваша скрипка …. но скрипка, опубликованная Феликсом Ламером, с вашим исходным кодом

Метки: