blur([[data],fn])

概述

当元素失去焦点时触发 blur 事件。

这个函数会调用执行绑定到blur事件的所有函数,包括浏览器的默认行为。可以通过返回false来防止触发浏览器的默认行为。blur事件会在元素失去焦点的时候触发,既可以是鼠标行为,也可以是按tab键离开的

参数

fn  在每一个匹配元素的blur事件中绑定的处理函数

[data],fn  data:blur([Data], fn) 可传入data供函数fn处理;fn:在每一个匹配元素的blur事件中绑定的处理函数

focus([[data],fn])

概述

当元素获得焦点时,触发 focus 事件。

可以通过鼠标点击或者键盘上的TAB导航触发。这将触发所有绑定的focus函数,注意,某些对象不支持focus方法。

参数

fn   在每一个匹配元素的focus事件中绑定的处理函数。

[data],fn   data:focus([Data], fn) 可传入data供函数fn处理;fn:在每一个匹配元素的focus事件中绑定的处理函数

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
<title></title>
<script>
var blurText="失去焦点";
var focusText="获得焦点";
$(document).ready(function(){
$("#input").blur(blurText,function(){
$(this).val(blurText);
$(this).removeClass("main");
}); $("#input").focus(focusText,function(){
$(this).val(focusText);
$(this).addClass("main");
});
});
</script>
<style>
.main{
border: solid;
}
</style>
</head>
<body>
<input id="input" type="text" />
</body>
</html>

jQuery事件--blur()和focus()的更多相关文章

  1. jquery的blur之后,focus获取不到焦点的解决办法

    一:很多童鞋可能会遇到这种情况: jquery的blur之后,focus获取不到焦点. 二:使用场景: 用户填写信息的时候,若邮箱为空,则提示 请填写邮箱,并将光标置于填写邮箱的文本框里,方便用户的再 ...

  2. 一大波jQuery事件即将来袭!

    一.jQuery事件 1.focus()元素获得焦点 2.blur()元素失去焦点 3.change() 表单元素的值发生变化(可用于验证用户名是否存在) 4.click() 鼠标单击 5.dbcli ...

  3. jQuery事件整合

    一.jQuery事件 1.focus()元素获得焦点 2.blur()元素失去焦点 3.change() 表单元素的值发生变化(可用于验证用户名是否存在) 4.click() 鼠标单击 5.dbcli ...

  4. jquery失去焦点与获取焦点事件blur() focus()

    以前我们在js中写input各种事件时都会直接在input中写,昨天开始我开始全面使用jquery了,现在来谈一下我对jquery blur() focus()事件的学习笔记. 对于元素的焦点事件,我 ...

  5. Knockout: 实践CSS绑定和jQuery的blur失去焦点事件, 给未通过校验的输入框添加红色边框突出显示.

    目的: 实践一下Knockout提供的CSS绑定功能和JQuery的blur失去焦点事件, 这次不使用Knockout的afterkeydown事件了. 步骤: 先在htm中添加.error的css样 ...

  6. 解密jQuery事件核心 - 模拟事件(四)

    前几章已经把最核心的实现都分解过了,这一章我们看看jQuery是如何实现事件模拟的 在Internet Explorer 8和更低,一些事件change 和 submit本身不冒泡,但jQuery修改 ...

  7. 深入学习jQuery事件绑定

    × 目录 [1]bind [2]trigger [3]delegate[4]on[5]one 前面的话 javascript有HTML.DOM0级.DOM2级和IE这四种事件处理程序,而jQuery对 ...

  8. jQuery源代码学习之九—jQuery事件模块

    jQuery事件系统并没有将事件坚挺函数直接绑定在DOM元素上,而是基于事件缓存模块来管理监听函数的. 二.jQuery事件模块的代码结构 //定义了一些正则 // // //jQuery事件对象 j ...

  9. jQuery事件总结

    blur() 触发或绑定blur事件.$("input").blur(function(){ $("input").css("background-c ...

随机推荐

  1. linux 源码安装 mono

    $ yum install bison gettext glib2 freetype fontconfig libpng libpng-devel libX11 libX11-devel glib2- ...

  2. shell 变量的数值计算实践 expr

    expr(evaluate(求值)expressions(表达式))命令既可以用于整数运算,也可以用于相关字符串长度.匹配等的运算处理 expr 用做计算 必须有一个空格才会计算 [root@salt ...

  3. 前端 HTML body标签相关内容 常用标签 分割线 <hr>

    分割线 <hr> <hr>标签用来在HTML页面中创建水平分隔线,通常用来分隔内容 <!DOCTYPE html> <html lang="en&q ...

  4. HttpUrlConneciton上传JSON数据

    try { //创建连接 URL url = new URL(url); HttpURLConnection connection = (HttpURLConnection) url.openConn ...

  5. 报错解决——DateTimeField *** received a naive datetime (***) while time zone support is active

    这是一个跟时区有关的问题,报错中说到datetime字段得到一个naive datetime,而不是支持time zone的active datetime由于Django的设置中米哦人USE_TZ设置 ...

  6. 关于vue中eslint规范报错问题

    /* global _ */这样 页面_就不会报错了

  7. Spark History Server产生背景

    以standalone运行模式为例,在运行Spark Application的时候,Spark会提供一个WEBUI列出应用程序的运行时信息:但该WEBUI随着Application的完成(成功/失败) ...

  8. [vue]组件的导入

    参考: http://vue2.mmxiaowu.com/article/584a3957fc007e72b0f576d9 vue组件的注册 1.通过components方式注册 2.通过router ...

  9. 281A

    #include <iostream> #include <string> #include <cctype> using namespace std; int m ...

  10. Linux命令:tar命令批量解压方法总结

    tar命令批量解压方法总结 (2010-05-24 17:48:46) 转载▼ 标签: tar 批量解压 杂谈 分类: linux学习 由于linux的tar命令不支持批量解压,所以很多网友编写了好多 ...