JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法
2016-03-04 14:13
806 查看
这篇文章主要介绍了JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法,涉及javascript针对页面元素样式及属性的相关操作技巧,需要的朋友可以参考下:
这个是html代码:
<div class="contain">
<div class="inputFullNameContain"><input class="inputFullName" type="text" id="search_content" /> </div>
</div>
下面是js代码:
<script type="text/javascript" >
(function () {
var id = document.getElementById('search_content');
if (id) {
var name = id;
var unclicked = function () {
if (name.value == '') {
name.style.background = 'url("images/inputBackground.png") no-repeat center';
}
};
var clicked = function () {
name.style.background = 'none';
};
name.onfocus = clicked;
name.onblur = unclicked;
unclicked();
}
})();
</script>
这个是html代码:
<div class="contain">
<div class="inputFullNameContain"><input class="inputFullName" type="text" id="search_content" /> </div>
</div>
下面是js代码:
<script type="text/javascript" >
(function () {
var id = document.getElementById('search_content');
if (id) {
var name = id;
var unclicked = function () {
if (name.value == '') {
name.style.background = 'url("images/inputBackground.png") no-repeat center';
}
};
var clicked = function () {
name.style.background = 'none';
};
name.onfocus = clicked;
name.onblur = unclicked;
unclicked();
}
})();
</script>
相关文章推荐
- MVC中调用Public_Class时,VS2012老提示:当前上下文中不存在名称“Json”的解决方法
- JS入门笔记
- IntelliJ IDEA中js代码报如下警告的解决方法
- javaScript如何监听浏览器关闭事件(区别刷新事件)
- div实现拖拽效果,同时包含iframe
- JSP的脚本元素 指令元素 动作元素 页面元素以及执行过程
- js实践篇:例外处理Try{}catch(e){}
- js省市级联
- jsp基本语法总结
- nativejs调用安卓蓝牙
- J2EE中的struct中的json数据接收和发送
- js中数组的排序
- Js操作剪切板
- JS模拟Map(2)
- Js操作剪切板
- 如何让js在最后执行
- JavaScript获取某年某月的最后一天
- JS中函数声明与函数表达式的不同
- JavaScript模块化编程
- json与jsonp