js操作输入框提示信息且响应鼠标事件


Posted in Javascript onMarch 25, 2014

我们经常遇到一些输入框,比如注册网站的输入框就有默认提示值,当获取鼠标焦点的时候,默认值被删除,当用户没输入东西焦点离开的时候,又恢复默认提示值。这方法用js代码实现如下:

html代码:

<input type="text" id="email" name="email" class="txt_input" value="请输入经常使用的邮箱" onfocus="fn_focus(this);" onblur="fn_blur(this);"/>

js代码:
function fn_focus(ele){ 
if(ele.value == ele.defaultValue){ 
ele.value = ''; 
} 
} 
function fn_blur(ele){ 
var reg = /^[\s]*$/; 
if(reg.test(ele.value) || ele.value == ele.defaultValue){ 
ele.value = ele.defaultValue; 
} 
}
Javascript 相关文章推荐
JavaScript 常用函数
Dec 30 Javascript
jQuery getJSON()+.ashx 实现分页(改进版)
Mar 28 Javascript
jQuery 网易相册鼠标移动显示隐藏效果实现代码
Mar 31 Javascript
JavaScript获取伪元素(Pseudo-Element)属性的方法技巧
Mar 13 Javascript
js表单中选择框值的获取及表单的序列化
Dec 17 Javascript
JavaScript代码实现左右上下自动晃动自动移动
Apr 08 Javascript
Kindeditor在线文本编辑器如何过滤HTML
Apr 14 Javascript
利用js获取下拉框中所选的值
Dec 01 Javascript
详解vue-cli 接口代理配置
Dec 13 Javascript
vuejs使用axios异步访问时用get和post的实例讲解
Aug 09 Javascript
vue watch监控对象的简单方法示例
Jan 07 Vue.js
JavaScript事件的委托(代理)的用法示例详解
Feb 18 Javascript
jquery动态更换设置背景图的方法
Mar 25 #Javascript
jquery队列queue与原生模仿其实现方法分享
Mar 25 #Javascript
jquery下拉select控件操作方法分享(jquery操作select)
Mar 25 #Javascript
jquery的each方法使用示例分享
Mar 25 #Javascript
提取jquery的ready()方法单独使用示例
Mar 25 #Javascript
jquery跨域请求示例分享(jquery发送ajax请求)
Mar 25 #Javascript
jquery解析xml字符串示例分享
Mar 25 #Javascript
You might like
一个SQL管理员的web接口
2006/10/09 PHP
php5.5新数组函数array_column使用
2013/07/08 PHP
php实现推荐功能的简单实例
2019/09/29 PHP
jQuery LigerUI 插件介绍及使用之ligerDrag和ligerResizable示例代码打包
2011/04/06 Javascript
jquery插件实现鼠标经过图片右侧显示大图的效果(类似淘宝)
2013/02/04 Javascript
JS 如何获取radio选中后的值及不选择取radio的值
2013/10/28 Javascript
浅谈 javascript 事件处理
2015/01/04 Javascript
纯js实现无限空间大小的本地存储
2015/06/18 Javascript
省市区三级联动下拉框菜单javascript版
2015/08/11 Javascript
BootStrap3使用错误记录及解决办法
2016/12/22 Javascript
JS使用for in有序获取对象数据
2020/05/19 Javascript
Vue的Options用法说明
2020/08/14 Javascript
[01:07:46]完美世界DOTA2联赛循环赛 Magma vs IO BO2第二场 11.01
2020/11/02 DOTA
Python时间戳与时间字符串互相转换实例代码
2013/11/28 Python
Python2.7简单连接与操作MySQL的方法
2016/04/27 Python
Python的collections模块中namedtuple结构使用示例
2016/07/07 Python
轻松掌握python设计模式之访问者模式
2016/11/18 Python
对python中的for循环和range内置函数详解
2018/04/17 Python
Python异常处理操作实例详解
2018/05/10 Python
NumPy.npy与pandas DataFrame的实例讲解
2018/07/09 Python
对Python中的条件判断、循环以及循环的终止方法详解
2019/02/08 Python
python打开音乐文件的实例方法
2020/07/21 Python
python音频处理的示例详解
2020/12/23 Python
canvas简易绘图的实现(海绵宝宝篇)
2018/07/04 HTML / CSS
Finishline官网:美国一家领先的运动品牌鞋类、服装零售商
2016/07/20 全球购物
Maison Lab荷兰:名牌Outlet购物
2018/08/10 全球购物
美赞臣新加坡官方旗舰店:Enfagrow新加坡
2019/05/15 全球购物
沃尔玛加拿大:Walmart.ca
2020/03/02 全球购物
澳大利亚床上用品、浴巾和家居用品购物网站:Bambury
2020/04/16 全球购物
学校采购员岗位职责
2014/01/02 职场文书
初中学生期末评语
2014/04/24 职场文书
设计专业自荐信
2014/06/19 职场文书
学习实践科学发展观心得体会
2014/09/10 职场文书
求职信格式范文
2015/03/19 职场文书
2015年服务员个人工作总结
2015/05/27 职场文书
Nginx设置日志打印post请求参数的方法
2021/03/31 Servers