javascript 从输入字段中删除类型文本
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14500270/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
remove type text from input field
提问by SEoF
Note: I am new to Javascript.
注意:我是 Javascript 的新手。
Here is code:
这是代码:
it is from the html page itself
它来自 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||
| --------------------- ------ |
|___________________________________|
Here what it does: when search button is pressed it opens the search field
它的作用是:按下搜索按钮时,它会打开搜索字段
the search image is a background:
搜索图像是背景:
#ToolSearchField {
background:url(../../Content/images/search_but.png) no-repeat scroll
right center transparent;
cursor:pointer; }
游标:指针;}
How to remove the text in the search field? with Javascript or CSS, tried both but it wasn't successful.
如何删除搜索字段中的文本?使用 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();
The final result should have search button that launches the search action.
最终结果应该有启动搜索操作的搜索按钮。
Tell me please, what am I doing wrong.
请告诉我,我做错了什么。
回答by Spork
The var joyou're instantiating has the string value "Enter Search Term " after your first line of javascript. In the next line you're telling this string to remove(), which isn't achieving anything in the original element.
jo您正在实例化的 var在第一行 javascript 之后具有字符串值“Enter Search Term”。在下一行中,您将此字符串告知remove(),这不会在原始元素中实现任何目标。
Try document.getElementById("ToolSearchField").value = "";instead!
试试document.getElementById("ToolSearchField").value = "";吧!
回答by SEoF
It looks like you really want a placeholder:
看起来你真的想要一个占位符:
<input type="text" class="ProductFinderText"
id="ToolSearchField"
placeholder="Enter Search Term " />
Then include a placeholder polyfill for older browsers.
然后为旧浏览器包含一个占位符 polyfill。
回答by paul
Take a look at this tutorial here: http://www.ozzu.com/javascript-tutorials/tutorial-watermark-text-boxes-html-javascript-jquery-t106384.html
在此处查看本教程:http: //www.ozzu.com/javascript-tutorials/tutorial-watermark-text-boxes-html-javascript-jquery-t106384.html
The tutorial shows how to achieve your effect using jQuery. If you are new to Javascript, then I strongly advise investigating jQuery, it makes a lot of things a lot easier.
本教程展示了如何使用 jQuery 实现您的效果。如果您不熟悉 Javascript,那么我强烈建议您研究 jQuery,它使很多事情变得容易得多。

