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 相关文章推荐
通过jQuery打造支持汉字,拼音,英文快速定位查询的超级select插件
Jun 18 Javascript
基于jquery的图片的切换(以数字的形式)
Feb 14 Javascript
JQuery记住用户名密码实现下次自动登录功能
Apr 27 Javascript
JS判断字符串包含的方法
May 05 Javascript
javascript中$(function() {});写与不写有哪些区别
Aug 10 Javascript
js格式化时间的方法
Dec 18 Javascript
JS实现环形进度条(从0到100%)效果
Jul 05 Javascript
微信小程序 实例应用(记账)详解
Sep 28 Javascript
Javascript使用function创建类的两种方法(推荐)
Nov 19 Javascript
使用get方式提交表单在地址栏里面不显示提交信息
Feb 21 Javascript
vue-cli安装使用流程步骤详解
Nov 08 Javascript
详解package.json版本号规则
Aug 01 Javascript
当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
php 图像函数大举例(非原创)
2009/06/20 PHP
通用PHP动态生成静态HTML网页的代码
2010/03/04 PHP
php实现跨域提交form表单的方法【2种方法】
2016/10/17 PHP
PHP设计模式之观察者模式定义与用法示例
2018/08/04 PHP
PHP的PDO预定义常量讲解
2019/01/24 PHP
jQuery下扩展插件和拓展函数的写法(匿名函数使用的典型例子)
2010/10/20 Javascript
基于jQuery实现表格数据的动态添加与统计的代码
2011/01/31 Javascript
初学js 新节点的创建 删除 的步骤
2011/07/04 Javascript
jQuery的.live()和.die() 使用介绍
2011/09/10 Javascript
uploadify 3.0 详细使用说明
2012/06/18 Javascript
jquery获取焦点和失去焦点事件代码
2013/04/21 Javascript
Javascript alert消息换行的方法
2013/08/07 Javascript
jquery ajax对特殊字符进行转义防止js注入使用示例
2013/11/21 Javascript
jQuery filter函数使用方法
2014/05/19 Javascript
JavaScript也谈内存优化
2014/06/06 Javascript
2则自己编写的jQuery特效分享
2015/02/26 Javascript
javascript实现3D切换焦点图
2015/10/16 Javascript
JS实现超简单的鼠标拖动效果
2015/11/02 Javascript
js阻止浏览器默认行为触发的通用方法(推荐)
2016/05/15 Javascript
AngularJS的$location使用方法详解
2017/10/19 Javascript
VUE重点问题总结
2018/03/19 Javascript
javascript中如何判断类型汇总
2019/05/14 Javascript
pip安装Python库时遇到的问题及解决方法
2017/11/23 Python
python提取图像的名字*.jpg到txt文本的方法
2018/05/10 Python
python制作图片缩略图
2019/04/30 Python
Python django框架应用中实现获取访问者ip地址示例
2019/05/17 Python
解决python有时候import不了当前的包问题
2019/08/28 Python
python使用多线程编写tcp客户端程序
2019/09/02 Python
python3 re返回形式总结
2020/11/20 Python
Python 可视化神器Plotly详解
2020/12/26 Python
考试作弊检讨书
2014/10/21 职场文书
个人培训总结
2015/03/05 职场文书
党员进社区活动总结
2015/05/07 职场文书
离婚代理词范文
2015/05/23 职场文书
本科毕业答辩开场白
2015/05/27 职场文书
python文件与路径操作神器 pathlib
2022/04/01 Python