单击时删除输入文本的默认值

Question

我有一个输入文本：

 <input name="Email" type="text" id="Email" value="[e-mail]" />

我想设置一个默认值，例如“您的编程问题是什么？具体一点。”在 Stack Overflow 中，当用户单击它时，默认值会消失。

原文由 Wassim AZIRAR 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

为了将来参考，我 必须 包含 HTML5 方法来执行此操作。

 <input name="Email" type="text" id="Email" value="[e-mail]" placeholder="What's your programming question ? be specific." />

如果您有 HTML5 文档类型和兼容 HTML5 的浏览器，这将起作用。但是， 目前许多浏览器不支持此功能，因此至少 Internet Explorer 用户将无法看到您的占位符。但是，请参阅 JQuery HTML5 占位符修复 « Kamikazemusic.com 以获得解决方案。使用它，您将非常现代且符合标准，同时还为大多数用户提供功能。

此外，提供的链接是一个经过良好测试和开发良好的解决方案，应该可以开箱即用。

原文由 MvanGeest 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

尽管此解决方案有效，但我建议您尝试 下面的 MvanGeest 解决方案，该解决方案使用 placeholder 和针对尚不支持它的浏览器的 JavaScript 回退。

如果您正在寻找与 MvanGeest 回复中的 jQuery 回退等效的 Mootools， 这里有一个.

–

您可能应该使用 onfocus 和 onblur 事件，以支持通过表格切换的键盘用户。

这是一个例子：

 <input type="text" value="[e-mail]" name="Email" id="Email"
 onblur="if (this.value == '') {this.value = '[e-mail]';}"
 onfocus="if (this.value == '[e-mail]') {this.value = '';}" />

原文由 mqchen 发布，翻译遵循 CC BY-SA 4.0 许可协议