单击时删除输入/文本区域的内容？答案

【问题标题】：Erasing the contents of an input / textarea when it's clicked?单击时删除输入/文本区域的内容？
【发布时间】：2010-09-03 08:41:37
【问题描述】：

为了更轻松地编辑这些字段，如果在单击它们时删除它们的内容，我会很好。此外，如果默认值（最初显示的）没有更改，则需要提交它，这意味着我（可能）不是在寻找自动删除的（n HTML 5）占位符，而是实际文本。如果取消选择该字段并留空，如果返回默认值会更好。

有什么建议吗？

P.S: 示例：http://www.makeuseof.com/ 顶部的“您的电子邮件”输入。

【问题讨论】：

标签： html input onclick textarea

【解决方案1】：

<input type="text" value="Something" onfocus="if (this.value == this.defaultValue) this.value='';" onblur="if (this.value == '') this.value = this.defaultValue;">

如果您想在多个元素中使用它，您应该将事件处理程序提取到外部函数/脚本。

编辑：

使用外部函数时，您需要提供对输入元素的引用作为函数的参数。

<script type="text/javascript">
    function focused(element){if (element.value == element.defaultValue) element.value='';}
    function blurred(element){if (element.value == '') element.value = element.defaultValue;}
</script>

<input type="text" value="Default Value" onfocus="focused(this)" onblur="blurred(this)">

注意：在 JavaScript 中，函数以小写字母开头是惯例。

【讨论】：

非常感谢您的快速回复，您能否更详细地解释一下“将事件处理程序提取到外部函数”，我以前从未使用过 javascript（尝试学习 PHP）。我认为我需要一个函数而不是脚本，因为我只会在一个页面上使用它。然后我在点击输入/文本区域时调用该函数，对吗？再次感谢。编辑：顺便说一句，就像一个魅力！

【解决方案2】：

试试onfocus:

<input type="text" value="Default text" onfocus="this.value = ''">

【讨论】：

是的，我已经尝试过了，但是如果它留空，它不会弹出默认值:-)。还是谢谢！