将字体颜色添加到搜索框中的对焦事件
Adding Font color to Onfocus event in Search Box
如何在我的搜索框中添加默认值的颜色和字体。
<input type="text" name="q" value="Enter your keywords here"
onfocus="if (this.value == 'Enter your keywords here') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Enter your keywords here';}"
onwebkitspeechchange = "this.value = this.value.replace('Enter your keywords here','')";
x-webkit-speech style="left:9px;top:4px;position:relative;background-color:#fafafa;border:1px solid;color:#333;font-size:1.4em;width:400px;height:28px"; />
您可以设置输入框的默认样式,然后在对焦和模糊事件上更改颜色,如下所示:
<input type="text" name="q" value="Enter your keywords here"
onfocus="if (this.value == 'Enter your keywords here') {
this.value = '';
this.style.color = '#000';
}"
onblur="if (this.value == '') {
this.value = 'Enter your keywords here';
this.style.color = '#CCC';
}"
onwebkitspeechchange = "this.value = this.value.replace('Enter your keywords here','')";
x-webkit-speech
style="left:9px;top:4px;position:relative;background-color:#fafafa;border:1px solid; color:#CCC;font-size:1.4em;width:400px;height:28px";
/>
您绝对应该考虑将此事件代码放在单独的脚本中,以使代码看起来更干净。
你也可以看看这个小提琴,以获得更干净的代码。http://jsfiddle.net/MXpSw/
更改样式的颜色...
<input type="text" name="q" value="Enter your keywords here"
onfocus="if (this.value == 'Enter your keywords here') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Enter your keywords here';}"
onwebkitspeechchange = "this.value = this.value.replace('Enter your keywords here','')";
x-webkit-speech style="left:9px;top:4px;position:relative;background-color:#fafafa;border:1px solid #555;color:#aaa;font-size:1.4em;width:400px;height:28px"; />
相关文章:
- 搜索日历事件的Javascript正则表达式
- Angular JS根据搜索结果和点击事件更新DOM元素
- JS在input标签上使用keyup事件进行搜索
- 谷歌地图 api v3 搜索多边形没有鼠标事件
- 当我单击chrome的输入类型=搜索元素上的X时,是否触发了任何事件
- 通过jQueryAJAX和keyup事件搜索特定的术语
- 尝试在“单击”或“聚焦”GCSE搜索表单输入时触发jquery事件
- 搜索诸如提交完成事件之类的内容以关闭加载程序
- 用硒填充和操作jqGrid的搜索小部件似乎不会触发DOM表单事件
- 单击输入类型=搜索时重置按钮的任何事件
- 检测 Youtube 搜索事件
- 将字体颜色添加到搜索框中的对焦事件
- 尝试取消反弹搜索函数调用会导致不会将任何事件传递给函数
- 传单地理搜索:从找到的地址返回纬度/液化天然气事件
- 搜索机器人或垃圾邮件机器人是否能够模拟/触发JavaScript事件
- 在点击事件中搜索DOM
- 以“搜索”按钮为目标的OnPress事件会触发整个页面的“提交”按钮
- 如何使用图形API查询公共facebook事件?[更新的搜索]
- iPhone谷歌图像搜索触摸事件功能是如何工作的
- j查询点击事件搜索栏