Ограничение диапазона дат с помощью JavaScript

#javascript #date-range

#javascript #диапазон дат

Вопрос:

Есть два поля ввода типа text для ввода даты начала и даты окончания в формате мм / дд / гггг. Мне нужна функция JavaScript для проверки того, что интервал диапазона дат между этими введенными датами не превышает 14 дней. И максимальной датой должна быть текущая дата. Есть ли плагин или быстрое решение для этого? Я пытался использовать jQuery UI datepicker, который работал бы нормально, но у меня есть пользовательская функция getElementByClassName, которая конфликтует с jQuery.

Спасибо.

Комментарии:

1. Почему вы не отображаете дату автоматически во втором текстовом поле, добавляя 14, чтобы не было необходимости проверять

Ответ №1:

Следующие фрагменты должны дать вам несколько идей.

 <script>
    var date1 = '01/14/2011';
    var date2 = '01/25/2011';

    // calculate the number of days between date1 and date2
    var daysBetween = new Date(date2).getTime() - new Date(date1).getTime();
    alert('days between = '   daysBetween / 86400000);

    // check date3 against current date
    var now = new Date();
    var date3 = new Date('04/20/2011');
    if (date3 < now)
      alert('date3 is less than current date');

</script>
  

Итак, чтобы объединить в функцию, вы могли бы сделать что-то вроде этого:

 <script>
    function checkDates(date1, date2) {
        // calculate the number of days between date1 and date2
        var daysBetween = (new Date(date2).getTime() - new Date(date1).getTime()) / 86400000;

        if (daysBetween > 14)
          return false;

        var now = new Date();
        if (date2 < now)
          return false;

        return true;

    }
  

Ответ №2:

Я работал над этой проблемой и обнаружил, что функция focusout является лучшим решением, соответствующим моим требованиям. Код Jquery:

 $("#datefield").focusout(function () {
  date = $("#datefield").val();
  if (date > "2021-06-30" || date < "2020-07-01") {
    alert("Please enter a valid date.");
    $("#datefield").val("");
  }
});