Блог

Главная - Вопросы по программированию - тип ввода формат даты не работает в chrome

тип ввода формат даты не работает в chrome

#html #reactjs

Вопрос:

У меня есть ввод следующей даты:

                            <input
                                    type="date"
                                    placeholder="DOB (DD/MM/YYYY)"
                                    //maxLength="100"
                                    className={`inputText ${styles.inputText}`}
                                    value={dob}
                                    onChange={(e) =>
                                        this.setState({
                                            dob: e.target.value,
                                        })
                                    }
                                />

Когда я запускаю его в своем chrome или firefox, я получаю правильный вывод, который заключается в том, чтобы ввести описание изображения здесь

однако, когда мой друг запускает его на своем chrome, он получает: введите описание изображения здесь

Кто-нибудь знает, почему это происходит и/или как я могу это исправить ?

Заранее спасибо

Ответ №1:

Вы можете попробовать добавить для него css…

Вариант 1 — Добавьте css для конкретного ввода на определенной странице с классом.

CSS :

 .my_input_date::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}

HTML

 <input
    type="date"
    placeholder="DOB (DD/MM/YYYY)"
    //maxLength="100"
    className={`my_input_date inputText ${styles.inputText}`}
    value={dob}
    onChange={(e) =>
         this.setState({
         dob: e.target.value,
         })
    }
/>

Вариант 2 : для всех входных данных с датой ввода на любой странице…

 input[type="date"] ::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}

Ответ №2:

На самом деле поддержка chrome для «даты» нарушена. (Смотрите здесь). По крайней мере, на данный момент.

Использование «даты» в HTML абсолютно нормально — браузеры, которые не знают или не поддерживают тип ввода, должны вернуться к типу=»текст».

В настоящее время chrome частично поддерживает дату, что, по сути, нарушено (он добавляет пару кнопок вверх-вниз, но без указателя даты).

Конечно, вам нужно иметь в виду, что если вы используете type=’дата’, и если браузер поддерживает его, то вы захотите отключить любую поддержку datepicker, которую вы бы использовали в противном случае.

ОБНОВЛЕНИЕ (6 февраля 2012):

Мне кажется, что теперь это исправлено. Chrome больше не утверждает, что поддерживает тип ввода= «дата», и не обеспечивает частично полную реализацию.

ОБНОВЛЕНИЕ (17 августа 2012):

В Chrome теперь есть поддержка ввода типа=»дата», и на этот раз она более функциональна.

Метки: