Как очистить value у input-а при клике или переводе фокуса на него
Т.к. я еще начинающий яваскриптер 
начну писать для себя и других маленькие шпаргалки по js.
Итак, пусть у нас есть поле для ввода поискового запроса:
1 | <input type="text" value="Введите запрос..." /> |
Нам нужно чтобы при клике на этот инпут или при переводе фокуса на него (например при помощи кнопки tab), value становился пустым, чтобы можно было в него вводить своё значение. Делается это с помощью java script (onclick и onfocus):
1 | <input type="text" value="Введите запрос..." onclick="this.value='';" onfocus="this.value='';" /> |
Метки: input, java script
Комментарии (12) на “Как очистить value у input-а при клике или переводе фокуса на него”
Оставить комментарий
Для вставки кода используйте <code> ... </code>.
Loading ...
Метод хорош примерно до того момента, как пользователь после ввода текста не вздумает ещё раз нажать на поле.
Лучше по window.onload (или просто в конце кода страницы вызывать функцию) активировать функцию типа «забить value текстом», потом по onfocus вызывать функцию проверки содержимого, и если оно именно дефолтовый текст, очищать.
Точно, надо это иметь ввиду.
Так лучше:
Извиняюсь,так лучше:
<input value=»Search» onclick=»if(this.value = ‘Search’) {this.value = »};» onblur=»if(this.value === ») {this.value = ‘Search’};» />
value=»Search…» onblur=»if(this.value==») this.value=’Search…’;» onfocus=»if(this.value==’Search…’) this.value=»;»
И никаких проблем.
Ни один метод не годится для форм… они тупо не сохраняются. Для примера попробуйте на блог поставить.. и почитать как матерятся юзвери часто комментирующие
А как сделать так чтобы внизу инпута была надпись — «Например ….», при нажатии на которую запрос появлялся в инпуте. Короче говоря как это сделано на яндексе.
Дмитрий — вот ссылочка про то, что говорите Вы
http://html-css.info/2010/04/input-value-text/
Плохое решение, так лучше:
можно сделать используя стандартные методы в новых версиях браузеров (например safari 5.0) (см. гостевую книгу)
http://baza-lesnik.ru/
Ребят вот вам код который и делает все что Вам нужно, да еще и поле подсвечивает:
Нашёл работающий пример.
http://divhack.com/node/49