Onclick 事件删除文本输入字段中的默认值

我有一个输入字段：

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

当用户单击该框时，如何删除预定义的文本（输入您的名字）。

据我所知，Javascript 是做到这一点的最佳方法。如果错了请通知我。

HTML5 占位符属性

您可能想要placeholder功能：

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

适用于旧版浏览器的 Polyfill

这在某些较旧的浏览器中不起作用，但是存在polyfill https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills（有些需要 jQuery，有些则不需要）来修补该功能。

“管它呢，我自己来吧。”

如果您想推出自己的解决方案，您可以使用onfocus and 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 混合

你会发现我们大多数人并不热衷于通过诸如onblur and 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);
}

Demo: http://jsbin.com/azehum/2/edit http://jsbin.com/azehum/2/edit