Метод 1: использование атрибута «value»
<input type="date" value="2022-01-01">
Этот метод устанавливает начальную дату, предоставляя определенное значение атрибуту value. Просто замените дату в приведенном выше примере желаемой начальной датой.
Метод 2: динамическая установка значения с помощью JavaScript
<input type="date" id="myInput">
<script>
const input = document.getElementById('myInput');
const today = new Date().toISOString().split('T')[0];
input.value = today;
</script>
Здесь мы используем JavaScript для динамической установки значения поля ввода на текущую дату. Метод toISOString() преобразует текущую дату в строку формата «ГГГГ-ММ-ДД».
Метод 3. Использование JavaScript для установки конкретной начальной даты
<input type="date" id="myInput">
<script>
const input = document.getElementById('myInput');
const initialDate = new Date('2022-12-31').toISOString().split('T')[0];
input.value = initialDate;
</script>
В этом методе мы устанавливаем конкретную начальную дату, предоставляя строку даты конструктору «new Date()». Обновите строку даты до желаемой начальной даты.
Метод 4. Использование свойства defaultValue
<input type="date" id="myInput">
<script>
const input = document.getElementById('myInput');
const initialDate = '2023-06-15';
input.defaultValue = initialDate;
</script>
Этот метод устанавливает начальную дату, используя свойство defaultValue элемента ввода. Просто присвойте желаемую начальную дату переменной «initialDate».
Метод 5: атрибуты HTML5 «min» и «max»
<input type="date" min="2022-01-01" max="2023-12-31">
Установив атрибуты «min» и «max» поля ввода, вы можете определить диапазон выбираемых дат. Это фактически устанавливает начальную дату в указанном диапазоне.
Теперь, когда у вас есть несколько методов установки начальной даты в полях ввода, выберите тот, который лучше всего соответствует вашим потребностям, и приступайте к кодированию!