我想在我的网页上的搜索框显示字“搜索”在灰色斜体。当框接收到焦点时,它看起来就像一个空文本框。如果其中已经有文本,则应该正常显示文本(黑色,非斜体)。这将帮助我避免混乱的标签。

顺便说一句,这是一个页面Ajax搜索,所以它没有按钮。


当前回答

这叫做“水印”。

我找到了jQuery插件jQuery水印,不像第一个答案,它不需要额外的设置(原始答案也需要在表单提交之前进行特殊调用)。

其他回答

你可以添加和删除一个特殊的CSS类,用JavaScript修改输入值onfocus/onblur:

<input type="text" class="hint" value="Search..."
    onfocus="if (this.className=='hint') { this.className = ''; this.value = ''; }"
    onblur="if (this.value == '') { this.className = 'hint'; this.value = 'Search...'; }">

然后在CSS中指定一个样式提示类,例如:

input.hint {
    color: grey;
}

您可以使用HTML中的placeholder属性设置占位符(浏览器支持)。可以使用CSS更改字体样式和颜色(尽管浏览器支持有限)。

input[type=search]:::-webkit-input-placeholder {/* Safari, Chrome(, Opera?) */ 颜色:灰色; 字体样式:斜体; } input[type=search]:-moz-placeholder {/* Firefox 18- */ . txt 颜色:灰色; 字体样式:斜体; } input[type=search]::-moz-占位符{/* Firefox 19+ */ 颜色:灰色; 字体样式:斜体; } input[type=search]:-ms-input-placeholder {/* IE (10+? 颜色:灰色; 字体样式:斜体; } <input placeholder="Search" type=" Search" name="q">

简单的Html 'required'标签是有用的。

<form>
<input type="text" name="test" id="test" required>
<input type="submit" value="enter">
</form>

它指定在提交表单或按submit按钮之前必须填写输入字段。 这里有一个例子

你可以很容易地有一个框读“搜索”,然后当焦点改变到它有文本被删除。就像这样:

< onfocus =“这个输入。价值=“类型”=“文本”=“搜索”/>

当然,如果你这样做,用户自己的文本将消失时,他们点击。所以你可能想要使用更健壮的东西:

<input name="keyword_" type="text" size="25"  style="color:#999;" maxlength="128" id="keyword_"
onblur="this.value = this.value || this.defaultValue; this.style.color = '#999';"
onfocus="this.value=''; this.style.color = '#000';"
value="Search Term">

来自http://asp.net的AJAXToolkit用户