Как убедиться, что дата окончания всегда на 7 дней больше даты начала?

#javascript #html #date

#javascript #HTML #Дата

Вопрос:

У меня есть страница, на которой указаны дата начала и дата окончания, как показано ниже:

Как вы можете видеть, дата окончания всегда на 7 дней больше даты начала по умолчанию. Мне разрешено изменять дату начала, но как мне убедиться, что каждый раз, когда я меняю дату начала, дата окончания также добавляет 7 дней к соответствующей дате начала?

Код:

   <%

        String relPath = "../../../";
        String currentDate = CoreUtil.parseDate(new Date());

        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
        //get current date
        Calendar cal = Calendar.getInstance();
        //Number of Days to add
        cal.add(Calendar.DAY_OF_MONTH, 7);
        String defaultDate = sdf.format(cal.getTime());





    %>

Start Date:amp;emsp;<input class="txtStartDate" style="font: 13px/1.231 Trebuchet MS;" type="text" id="txtStartDate" name="Start Date" value="<%=currentDate%>" readonly><br><br>


End Date: amp;emsp; <input class="txtEndDate" style="font: 13px/1.231 Trebuchet MS;" type="text" id="txtEndDate" name="txtEndDate" value="<%=defaultDate%>"  readonly required/>

Редактировать:

Это мой код JavaScript:

 <Script>
    $('#txtStartDate').datepicker();
    $('#txtEndDate').datepicker();

    $('#txtStartDate').change(function(){
        var interval = 7;

        function convertDateString(p) { return (p < 10) ? '0'   p : p; }

        var startDate = new Date($(this).val());
        startDate.setDate(startDate.getDate()   interval);
        $('#txtEndDate').val( startDate.getFullYear()   '/'       convertDateString(startDate.getMonth()   1)   '/'   convertDateString(startDate.getDate()));
    });

</script>

В принципе, всякий раз, когда я меняю дату начала, дата окончания также должна автоматически меняться на (дата начала 7 дней), это все, что я пытаюсь сделать. Приведенный выше код должен был работать, но он не изменил дату окончания, когда я изменил дату начала.

1. О чем вы спрашиваете? Как определить, что дата начала изменилась? Как получить из него значение даты, добавить 7 дней и получить строку для даты окончания в JavaScript ? (Не Java, поскольку это должно происходить в веб-браузере, поэтому вопрос действительно помечен неправильным вопросом).

2. Прошу прощения, что я сформулировал это с неправильным тегом. Я отредактировал свой пост, чтобы он был понятнее.

3. хорошая библиотека — MomentJS, она действительно может помочь вам в этом.

4. Мой друг, не могли бы вы, пожалуйста, отметить мой ответ как принятый, если это помогло вам, хорошо?

Ответ №1:

Это может помочь.

 Date.prototype.addDays = function(days) {
    var date = new Date(this.valueOf());
    date.setDate(date.getDate()   days);
    return date;
}

$('#txtStartDate').datepicker();
$('#txtEndDate').datepicker();

$('#txtStartDate').change(function(){
    var interval = 7;
    var startDate = new Date($(this).val());
    $('#txtEndDate').val(startDate.addDays(interval));
});

Ответ №2:

Вы можете выполнить вычисление с использованием объекта даты JavaScript и форматирования с использованием строк:

 // Get references to HTML elements
const startInput = document.getElementById("txtStartDate");
const endInput = document.getElementById("txtEndDate");

// Listen for changes to #txtStartDate
startInput.addEventListener("change", updateEndDate);

// Respond to changes
function updateEndDate(event){

  // Calculate end date
  let endDate = new Date(startInput.value);
  endDate.setUTCDate(endDate.getUTCDate()   7);

  // Separate the parts of end date
  let yyyy = endDate.getUTCFullYear(),
      mm = endDate.getUTCMonth()   1,
      dd = endDate.getUTCDate();

  // Add initial zeros if needed
  if(mm < 10){mm = "0"   mm; }
  if(dd < 10){dd = "0"   dd; }

  // Format and display end date
  endInput.value = `${yyyy}-${mm}-${dd}`;

}

 <input type="date" id="txtStartDate" />
<input type="date" id="txtEndDate" />