Событие Onclick для удаления значения по умолчанию в текстовом поле ввода

Ответ 1

Атрибут закладок HTML5

Вероятно, вам нужна функциональность placeholder:

<input name="Name" placeholder="Enter Your Name" />

Polyfill для старых браузеров

Это не будет работать в некоторых старых браузерах, но существуют полиполны (некоторые требуют jQuery, а другие нет) для исправления этой функциональности.

"Вверните его, я сделаю это сам".

Если вы хотите перевернуть свое собственное решение, вы можете использовать события onfocus и onblur вашего элемента, чтобы определить, каково его значение:

<input name="Name" value="Enter Your Name"
       onfocus="(this.value == 'Enter Your Name') && (this.value = '')"
       onblur="(this.value == '') && (this.value = 'Enter Your Name')" />

Избегать смешивания HTML с JavaScript

Вы обнаружите, что большинство из нас не являются большими поклонниками оценки JavaScript из таких атрибутов, как onblur и onfocus. Вместо этого чаще всего рекомендуется связывать эту логику исключительно с JavaScript. Конечно, это немного более многословно, но он сохраняет хорошее разделение между вашей логикой и вашей разметкой:

var nameElement = document.forms.myForm.Name;

function nameFocus( e ) {
  var element = e.target || window.event.srcElement;
  if (element.value == "Enter Your Name") element.value = "";
}

function nameBlur( e ) {
  var element = e.target || window.event.srcElement;
  if (element.value == "") element.value = "Enter Your Name";
}

if ( nameElement.addEventListener ) {
  nameElement.addEventListener("focus", nameFocus, false);
  nameElement.addEventListener("blur", nameBlur, false);
} else if ( nameElement.attachEvent ) {
  nameElement.attachEvent("onfocus", nameFocus);
  nameElement.attachEvent("onblur", nameBlur);
}

Демо: http://jsbin.com/azehum/2/edit

Ответ 2

Это правильный, кросс-браузерный способ сделать это:

<input type="text" value="Enter Your Name" onfocus="if(this.value  == 'Enter Your Name') { this.value = ''; } " onblur="if(this.value == '') { this.value = 'Enter Your Name'; } " />

Ответ 3

Как уже говорилось, я даже видел этот вопрос placeholder - это ответ. HTML5 для победы! Но для тех бедных несчастных душ, которые не могут полагаться на эту функциональность, посмотрите на плагин jquery как на увеличение. HTML5 Placeholder jQuery Plugin

<input name="Name" placeholder="Enter Your Name">

Ответ 4

u может использовать placeholder, и когда u напишет текст в поле поиска, скрытие будет скрыто. Благодаря

<input placeholder="Search" type="text" />

Ответ 5

Используйте onclick="this.value=''":

<input name="Name" value="Enter Your Name" onclick="this.value=''">

Ответ 6

Это должно сделать это:

HTML

<input name="Name" value="Enter Your Name" onClick="blankDefault('Enter Your Name', this)">

JavaScript

function blankDefault(_text, _this) {
    if(_text == _this.value)
        _this.value = '';
}

Есть более/менее навязчивые способы, но это выполнит работу.

Ответ 7

Вы действительно хотите показать местозаполнитель, HTML 5 предлагает эту функцию, и это очень мило!

Попробуйте следующее:

<input name="Name" placeholder="Enter Your Name">

Ответ 8

<input name="Name" value="Enter Your Name" onfocus="freez(this)" onblur="freez(this)">


function freez(obj)
{
 if(obj.value=='')
 {
   obj.value='Enter Your Name';
 }else if(obj.value=='Enter Your Name')
 {
   obj.value='';
 }
} 

Ответ 9

В дополнение к placeholder="your text" вы также можете сделать onclick="this.value='';

Итак, это выглядит примерно так:

<input name="Name" value="Enter Your Name" onclick="this.value='';>