JavaScript：使用鼠标输入时清除搜索字段？

Question

我的主页上有一个textfield（）用于搜索字符串。 Normaly我有一个像＃34;进入searach的文本......＆＃34;在它。

现在，当用户点击它时，我将从文本中清除该框。

如何解决？ 的JavaScript？

Answer 1

可以使用HTML中的placeholder属性来完成此操作。例如：

<input type="text" placeholder="e.g. John Doe">

对于本机不支持此属性的浏览器，您可以使用JavaScript。

如果你正在使用jQuery，你可以考虑使用my placeholder plugin for jQuery，这是我见过的最强大的解决方案。这是一个演示页面：http://mathiasbynens.be/demo/placeholder

Answer 2

创建一个JavaScript文件或使用当前的文件然后写入：

Function function_name()
{

    document.getEelementByName("Control_Name").setAttribute("Value", '');
}

---

然后在页面头部：

<script id="js1" type="text/javascript" src="dir/file_name.js"></script>

控制标记变为：

<input type="text" name="Control_Name" onClick="return js1/function_name();" />

Answer 3

是的，你需要javascript来实现这一目标。您可以订阅onclick事件，当触发此事件时，将文本设置为空，然后取消订阅onclick事件，以避免每次用户点击时清除文本：

var foo = document.getElementById('foo');
foo.onfocus = function() {
    foo.value = '';
    foo.onfocus = null;
};

Live demo

如果您使用的是jquery，那么有一个非常好的watermark plugin允许您这样做。

Answer 4

我建议写一个onfocus Javascript处理程序;无论您是单击它还是选中它都会触发它。

<input type="text" name="..." value="" onfocus="this.value = '';" />

Answer 5

您可以使用onfocus和onblur javascript方法

<input type="text" name="searchinput" onblur="this.value='enter here to search...';" onfocus="this.value = '';" />