Input default value html: HTML DOM Input Text defaultValue Property

Как создать значение по умолчанию, которое исчезает, когда пользователь вводит форму? — HTML FAQ

Хорхе-Сегура 4 января 2020 г., 8:31 1

Какой код я могу использовать, чтобы показать значение по умолчанию, которое исчезнет, ​​как только вы напишете первый символ (без необходимости удалять значение по умолчанию, используя над или клавишу возврата, как это происходит в упражнении) в ячейке, где информация должна быть представлена?

Это то, что я видел на многих формах веб-сайтов, и я думаю, что это улучшает UX.

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

Тухлые помидоры: Фильмы | телешоу | Трейлеры фильмов | Отзывы

Rotten Tomatoes, родина томатометра, является самым надежным средством измерения качества кино и телевидения. Окончательный сайт для обзоров, трейлеров, шоу и билетов

факторадик

Для этого необходимо использовать атрибут заполнитель . Цитата из MDN:

заполнитель
Подсказка пользователю о том, что можно ввести в элемент управления. Текст заполнителя не должен содержать символы возврата каретки или перевода строки. Этот атрибут применяется, когда значением атрибута типа является текст , поиск , тел. , URL или электронная почта ; в противном случае он игнорируется.

Например, это поле ввода для поиска в Rotten Tomatoes:

 
  ..." autocomplete="off" value ="">
 

141 лайков

хорхе-сегура 5 января 2020 г., 10:55 3

Спасибо, factoradic! Я применил то, что вы сказали на практике, и это сработало!

12 лайков

6 апреля 2020 г., 10:02 4

Как выделить текст-заполнитель курсивом? Я пытался использовать теги выделения, но это не сработало. Можно ли это сделать с помощью HTML или это нужно сделать с помощью CSS? Заранее спасибо!

4 нравится

ч_о_с

надеюсь вы найдете ответ здесь
stackoverflow.com

Как сделать только заполнитель курсивом во вводе

HTML, ввод, заполнитель

спросил прабин бадьякар 04:57 — 25 декабря 14:00 UTC

5 лайков

gerardomtz_h 12 апреля 2020 г., 9:21 6

Зачем мне использовать id на входе?
Я плохо разбираюсь в id, не могли бы вы помочь мне с объяснением или рекомендацией веб-страницы/книги?

1 Нравится

h_o_s

идентификатор и класс — это селекторов , мы используем их для стилизации элементов в CSS , разница между идентификатором и классом заключается в том, что идентификатор может использоваться для идентификации одного элемента, тогда как класс может использоваться для идентификации большего количества элементов. чем один.
при изучении HTML вы не будете их использовать, поэтому не волнуйтесь, вы хорошо их поймете на уроках CSS .

11 лайков

альбертспн 26 октября 2020 г., 18:18

заполнитель

Привет, factoradic,
Принимает ли атрибут-заполнитель в этом случае (теги «вход» в формах) ту же роль / функцию, что и атрибут «значение».

Мои сомнения исходят из урока, где объясняется: «Значение атрибута value сочетается со значением атрибута name и отправляется в виде текста при отправке формы».

Атрибут-заполнитель будет работать так же? Подойдет стандартное кодирование формы? Заранее спасибо

samyadel 28 октября 2020 г. , 20:40 9

Атрибут

 const input = document.querySelector('input')
input.onblur = функция (е) {
    если (e.target.value === "") {
        // регистрируем, что значение отсутствует, или
        e.target.value = "Не указано" // или,
        e.target.value = "Некоторое значение по умолчанию"
    }
}
 

 
<дел>
  <тип ввода="файл">
  Выберите файл