Вот пример реализации формы, где при нажатии на кнопку во второе поле вводится дата из первого поля плюс 6 месяцев:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Добавление 6 месяцев к дате</title>
</head>
<body>
<form>
<label for="firstDate">Первая дата:</label>
<input type="date" id="firstDate" name="firstDate">
<br><br>
<label for="secondDate">Дата +6 месяцев:</label>
<input type="date" id="secondDate" name="secondDate" readonly>
<br><br>
<button type="button" onclick="addSixMonths()">Добавить 6 месяцев</button>
</form>
<script>
function addSixMonths() {
// Получаем значение из первого поля
const firstDateInput = document.getElementById('firstDate');
const firstDateValue = firstDateInput.value;
// Если дата не введена, ничего не делаем
if (!firstDateValue) {
alert('Пожалуйста, введите первую дату');
return;
}
// Создаем объект Date из введенного значения
const firstDate = new Date(firstDateValue);
// Добавляем 6 месяцев
const secondDate = new Date(firstDate);
secondDate.setMonth(secondDate.getMonth() + 6);
// Проверяем, не перешли ли мы на следующий день из-за разного количества дней в месяцах
// (например, 31 августа + 1 месяц = 1 октября)
if (secondDate.getDate() !== firstDate.getDate()) {
secondDate.setDate(0); // Устанавливаем последний день предыдущего месяца
}
// Форматируем дату в формат YYYY-MM-DD для поля ввода
const year = secondDate.getFullYear();
const month = String(secondDate.getMonth() + 1).padStart(2, '0');
const day = String(secondDate.getDate()).padStart(2, '0');
const formattedDate = `${year}-${month}-${day}`;
// Устанавливаем значение во второе поле
document.getElementById('secondDate').value = formattedDate;
}
</script>
</body>
</html>
Этот код:
- Создает форму с двумя полями для ввода даты и кнопкой
- При нажатии на кнопку считывает дату из первого поля
- Добавляет к ней 6 месяцев с учетом особенностей JavaScript Date (корректировка дней месяца)
- Записывает результат во второе поле, которое сделано readonly
Особенности обработки дат:
- Если исходная дата – например, 31 августа, то через 6 месяцев будет 28/29 февраля (для невисокосного/високосного года)
- Код корректирует такие случаи, устанавливая последний день месяца