Какой лучший способ для отображения текста по умолчанию в текстовых и текстовых областях
Форма на контактной странице моего сайта -us HTML имеет два поля
1) предмет
2) сообщение
Когда страница загружается в первый раз, я хочу, чтобы в этих двух полях отображались сообщения, подобные & quot;Enter subject here& Quot; и & quot;Enter Message here& Quot ;.
Я обнаружил, что мы можем сделать это, используя & quot; значение & quot; атрибут текстового поля, это лучший способ ?? .. Какие у меня есть альтернативы для достижения этой цели?
Ответы на вопрос(2)
Да, это лучший способ. Затем вы можете использовать JavaScript для очистки ввода текста / области, когда элемент получает фокус. Не забудьте подумать, как вы хотите обработать случай, когда пользователь отправляет текст по умолчанию. Т.е. это & quot; введите имя пользователя & quot; действительное имя пользователя или нет?
О, мне действительно нужно закончить писать мою статью на эту тему. Вот неполная версия:
Первый & # x2014; сообщение о том, что вводить в полеnot значение по умолчанию. Значения по умолчанию - это то, что может быть отправлено (например, страна, введенная на основе GeoIP, или адрес доставки из записей клиентов).
Второй & # x2014; использование значения по умолчанию в качестве фальшивой метки и последующее его стирание, когда пользователь фокусирует его (предположительно, вы не хотите, чтобы пользователь вручную удалял сообщение), вызывает проблемы с доступностью. Программы чтения с экрана считывают контент, на который направлен фокус, если вы удалите его, когда он станет сфокусированным, они не смогут получить информацию.
best вариант, на мой взгляд, это разместить<label> рядом с контролем. Веб-страницам обычно не хватает места & # x2014; полосы прокрутки не являются злом.
Если вы действительно хотите, чтобы он выглядел так, как будто он находится в элементе управления, то:
Put the<label> and <input> in a <div>
Set a class on that <div> using JavaScript (so you don't have a crap experience is JS isn't available)
Apply CSS to set the <div> to position: relative and give it a size.
Make the background of the <input> transparent and style it to fill the div
Position the <label> under the <input>
Write a function that checks to see if the value of the input is an empty string or not. Toggle a class on the div on and off depending on the answer.
When that class is set on the div, set text-indent to a high negative length (such as -999em) so that the text is hidden off screen (but still available to screen readers)