我看到这一切在网上,但想知道是否有人有上显示模糊输入值的最简单方法的JavaScript代码,但隐藏在焦点。
Answer 1:
这总是为我工作:
<input
type="text"
value="Name:"
name="visitors_name"
onblur="if(value=='') value = 'Name:'"
onfocus="if(value=='Name:') value = ''"
/>
Answer 2:
由于这仍对谷歌来了,我想指出的是,与HTML 5可以使用占位符属性与输入一件HTML来实现这一点。
<input type="text" id="myinput" placeholder="search..." />
占位符是现在整个现代浏览器的标准,所以这真的会是首选的方法。
Answer 3:
我喜欢jQuery的方法:
$(function(){
/* Hide form input values on focus*/
$('input:text').each(function(){
var txtval = $(this).val();
$(this).focus(function(){
if($(this).val() == txtval){
$(this).val('')
}
});
$(this).blur(function(){
if($(this).val() == ""){
$(this).val(txtval);
}
});
});
});
它被修改隐藏表单输入的值在对焦使用jQuery由扎克·珀杜。
Answer 4:
我所知道的最简单的方法如下:
<input
name="tb"
type="text"
value="some text"
onblur="if (this.value=='') this.value = 'some text'"
onfocus="if (this.value=='some text') this.value = ''" />
Answer 5:
如果你不关心有效的HTML,您可以使用placeholder
属性。 它将工作开箱上Safari浏览器,你可以添加一些不引人注目的JS模仿其他浏览器这种行为。
更多阅读:
- http://www.beyondstandards.com/archives/input-placeholders/ (JS实现)
- http://lab.dotjay.co.uk/experiments/forms/input-placeholder-text/
和谷歌。 ;-)
该解决方案是一个类似于乔希斯托多拉发布,但它更灵活,更具有普遍性。
Answer 6:
这是我上使用我的博客 。 刚去那里,后面签出源代码。
function displaySearchText(text){
var searchField = document.getElementById('searchField');
if(searchField != null)
searchField.value = text;
}
您的输入字段应该是这个样子:
<input id='searchField' name='q' onblur='displaySearchText("Search...");' onfocus='displaySearchText("");' onkeydown='performSearch(e);' type='text' value='Search...'/>
Answer 7:
对于所有浏览器:
<input onfocus="if(this.value == 'Your value') { this.value = '';}" onblur="if(this.value == '') { this.value = 'Your value';}" value="Your value" type="text" name="inputname" />
对于浏览器的最新版本:
<input type="text" name="inputname" placeholder="Your value" />
文章来源: How to show/hide input value on focus?