2

注意：我是 Javascript 新手。

这是代码：

它来自html页面本身

<form action="#" id="ToolKeywordSearch">
  <input type="text" class="ProductFinderText"
          id="ToolSearchField"onblur="if(this.value=='')    
             {this.value='Enter Search Term ';}" 
                onclick="if (this.value == 'Enter Search Term ')
                  { this.value = ''; }" value="Enter Search Term " />
</form>

 ___________________________________
|  _____________________     ______ |      (restriction does not let me insert image)
| |                  |O |   |      ||
| |enter search term | \|   |Search||                      
|  ---------------------     ------ |
|___________________________________|

它的作用是：按下搜索按钮时，它会打开搜索字段

搜索图像是背景：

#ToolSearchField {

 background:url(../../Content/images/search_but.png) no-repeat scroll 
    right center   transparent;

光标：指针；}

如何删除搜索字段中的文本？使用 Javascript 或 CSS，都尝试了，但都没有成功。

<script type="text/javascript">
    var jo = document.getElementById("ToolSearchField").value;
    alert(jo);
</script>

I receive Enter Search Term as an output. 

Then if I insert remove(); instead, it doesn't do anything.

var jo = document.getElementById("ToolSearchField").value;
    jo.remove();

最终结果应该具有启动搜索操作的搜索按钮。

请告诉我，我做错了什么。

4

3 回答 3

4

您正在实例化的 varjo在您的第一行 javascript 之后具有字符串值“输入搜索词”。在下一行中，您将告诉这个字符串到remove()，这在原始元素中没有实现任何东西。

试试document.getElementById("ToolSearchField").value = "";吧！

于 2013-01-24T11:33:49.630 回答
1

看起来你真的想要一个占位符：

<input type="text" class="ProductFinderText"
    id="ToolSearchField"
    placeholder="Enter Search Term " />

然后为旧版浏览器添加一个占位符 polyfill。

于 2013-01-24T12:44:34.157 回答
0

在此处查看本教程：http ://www.ozzu.com/javascript-tutorials/tutorial-watermark-text-boxes-html-javascript-jquery-t106384.html

本教程展示了如何使用 jQuery 实现您的效果。如果您是 Javascript 新手，那么我强烈建议您研究 jQuery，它使很多事情变得容易得多。

于 2013-01-24T11:33:24.537 回答