jQuery focus和blur事件的应用详解


Posted in Javascript onJanuary 26, 2014

一、需求原因
在填写表单时需要实现如下效果
jQuery focus和blur事件的应用详解
二、具体实现

<!DOCTYPE html PUBLIC "-//W3C//DTDHTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type"content="text/html; charset=UTF-8">
<title>鼠标点击后无文字,挪开鼠标后有文字</title>
<script language="JavaScript"src="../jQuery/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
     $(function(){
         /*进入焦点时触发*/
         $("#account").focus(function(){
              varoldValue = $(this).val();
              if(oldValue == this.defaultValue){
                  $(this).val("");
              }
         });  
         /*失去焦点时触发*/
         $("#account").blur(function(){
              alert("12");
              varoldValue = $(this).val();
              if(oldValue == ""){
                   $(this).val(this.defaultValue);
              }
         });
     });
</script>
</head>
<body>
帐号:<input id="account"name="account" type="text" value="请输入帐号">
</body>
</html>
Javascript 相关文章推荐
JavaScript CSS修改学习第六章 拖拽
Feb 19 Javascript
禁用Tab键JS代码兼容Firefox和IE
Apr 18 Javascript
浅谈JavaScript函数节流
Dec 09 Javascript
jQuery实现仿腾讯微博滑出效果报告每日天气的方法
May 11 Javascript
详细介绍jQuery.outerWidth() 函数具体用法
Jul 20 Javascript
js常用的继承--组合式继承
Mar 06 Javascript
详解使用vue实现tab 切换操作
Jul 03 Javascript
electron实现qq快捷登录的方法示例
Oct 22 Javascript
js实现随机8位验证码
Jul 24 Javascript
js面向对象之实现淘宝放大镜
Jan 15 Javascript
jquery实现简单每周轮换的日历
Sep 10 jQuery
jQuery+ajax实现文件上传功能
Dec 22 jQuery
当jQuery1.7遇上focus方法的问题
Jan 26 #Javascript
jQuery中delegate和on的用法与区别详细解析
Jan 26 #Javascript
使用javascript为网页增加夜间模式
Jan 26 #Javascript
jQuery:delegate中select()不起作用的解决方法(实例讲解)
Jan 26 #Javascript
javascript:FF/Chrome与IE动态加载元素的区别说明
Jan 26 #Javascript
js中的时间转换—毫秒转换成日期时间的示例代码
Jan 26 #Javascript
JS将所有对象s的属性复制给对象r(原生js+jquery)
Jan 25 #Javascript
You might like
phpinfo 系统查看参数函数代码
2009/06/05 PHP
phpmyadmin 访问被拒绝的真实原因
2009/06/15 PHP
无法在发生错误时创建会话,请检查 PHP 或网站服务器日志,并正确配置 PHP 安装(win+linux)
2012/05/05 PHP
浅谈discuz密码加密的方式
2014/05/22 PHP
PHP+MYSQL中文乱码问题
2015/07/01 PHP
yii2利用自带UploadedFile实现上传图片的示例
2017/02/16 PHP
PHP dirname(__FILE__)原理及用法解析
2020/10/28 PHP
js 代码优化点滴记录
2012/02/19 Javascript
js 得到文件后缀(通过正则实现)
2013/07/08 Javascript
让jQuery Mobile不显示讨厌loading界面的方法
2014/02/19 Javascript
jquery 构造函数在表单提交过程中修改数据
2015/05/25 Javascript
javascript伸缩型菜单实现代码
2015/11/16 Javascript
JS 日期与时间戮相互转化的简单实例
2016/06/22 Javascript
js前端日历控件(悬浮、拖拽、自由变形)
2017/03/02 Javascript
微信小程序实现瀑布流布局与无限加载的方法详解
2017/05/12 Javascript
NodeJs使用Mysql模块实现事务处理实例
2017/05/31 NodeJs
vue脚手架vue-cli的学习使用教程
2017/06/06 Javascript
JavaScript实现的拼图算法分析
2019/02/13 Javascript
详解如何更好的使用module vuex
2019/03/27 Javascript
Django项目开发中cookies和session的常用操作分析
2018/07/03 Python
在python tkinter中Canvas实现进度条显示的方法
2019/06/14 Python
python pandas.DataFrame.loc函数使用详解
2020/03/26 Python
Python通过getattr函数获取对象的属性值
2020/10/16 Python
canvas绘制圆角头像的实现方法
2019/01/17 HTML / CSS
介绍一下常见的木马种类
2014/11/15 面试题
青年文明号事迹材料
2014/01/18 职场文书
八年级数学教学反思
2014/01/31 职场文书
人事专员的职责
2014/02/26 职场文书
授权委托书格式模板
2014/04/03 职场文书
怀念母亲教学反思
2014/04/28 职场文书
2015年社区矫正工作总结
2015/04/21 职场文书
抢劫罪辩护词
2015/05/21 职场文书
记者节感言
2015/08/03 职场文书
计算机教师工作总结
2015/08/13 职场文书
2016学习依法治国心得体会
2016/01/15 职场文书
spring 项目实现限流方法示例
2022/07/15 Java/Android