blur和focus的运用

这两个事件不仅仅只能运用与input、span之类的元素。还可以运用于window。

可以切换title。

当切换当前页面时,改变title的文字为‘离开了’.

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>select事件</title>
 6 </head>
 7 <body>
 8     <input type="text" value="select事件">
 9     <script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
10     <script type="text/javascript">
11         $(‘input‘).select(function(event) {
12             $(this).css(‘background‘,‘#999‘);
13         });
14         var title = $(‘title‘).html();
15         $(window).blur( function () { $(‘title‘).text(‘你离开了!‘) } );
16         $(window).focus(function(){$(‘title‘).text(title);})
17     </script>
18 </body>
19 </html>
时间: 2024-08-01 10:45:39

blur和focus的运用的相关文章

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

一:很多童鞋可能会遇到这种情况: jquery的blur之后,focus获取不到焦点. 二:使用场景: 用户填写信息的时候,若邮箱为空,则提示 请填写邮箱,并将光标置于填写邮箱的文本框里,方便用户的再次输入. 想当然的我们会使用jquey的blur()和focus()两个函数来实现上面的需求: $("#email").blur(function(){ if($("#email").val()==''){ alert('请填写您的邮箱'); $("#emai

jquery文本框的focus和blur事件

jquery文本框的focus和blur事件 focus事件在元素获取焦点时触发,如点击文本框时,触发该事件:而blur事件则在元素丢失焦点时触发,如点击除文本框的任何元素,都会触发该事件 代码如下 <body> <h3>表单中文本框的focus和blur事件</h3> <input id="txtest" type="text" value="" /> <div></div>

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

以前我们在js中写input各种事件时都会直接在input中写,昨天开始我开始全面使用jquery了,现在来谈一下我对jquery blur() focus()事件的学习笔记. 对于元素的焦点事件,我们可以使用jQuery的焦点函数focus(),blur(). focus():得到焦点时使用,和javascript中的onfocus使用方法相同. 如:  代码如下 复制代码 $("p").focus(); 或$("p").focus(fn) blur():失去焦点

jquery中focus()失效怎么解决

又学到一个新的知识! 今天在写表单验证的时候遇到一个关于获取焦点的focus()问题. 场景说明:在验证密码输入格式不对之后,弹出alert()提示框,提示密码不对,请重新输入.同时清空密码框并获得焦点,代码如下: 查了好久的资料才找到一个原因,原来这是由于FF和IE的关于blur和focus的机制不一样,FF的focus只能在blur之前.所以用settimeout()做了一个延迟处理,代码如下: (为了加强效果,在密码框获得焦点之后,加了个CSS边框进去) 这样修改了之后,就可以实现想要的效

快速解决js开发下拉框中blur与click冲突

在开发中我们会经常遇到blur和click冲突的情况.下面叙述了开发中常遇到的"下拉框"的问题,并提供了两种解决方案. 一.blur和click事件简述 blur事件:当元素失去焦点时触发blur事件:其为表单事件,blur和focus事件不会冒泡,其他表单事件都可以.click事件:当点击元素时触发click事件:所有元素都有此事件,会产生冒泡. 示例1:blur事件为表单事件 1 2 3 4 5 6 7 8 9 10 11 12 13 <input type="te

div无法触发blur事件解决的方法

默认情况下div无法获取焦点,无法触发focus与blur事件,推測span,a等标签也无法触发焦点事件(input:button.及button标签能够触发) 怎样使div触发blur事件:能够给div加上tabindex属性 在线演示:http://sandbox.runjs.cn/show/e0bvfcag 源代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U

div无法触发blur事件解决办法

默认情况下div无法获取焦点,无法触发focus与blur事件,猜测span,a等标签也无法触发焦点事件(input:button,及button标签可以触发) 如何使div触发blur事件:可以给div加上tabindex属性 在线演示:http://sandbox.runjs.cn/show/e0bvfcag 源码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT

javascript操作表单

表单元素除了可以运用上述所有DOM相关操作外,为了简化,还有一系列自己的属性和方法. 表单除了支持鼠标,键盘,更改和html时间之外,还支持一些表单特有的事件,如focus,change,blur等等. 一.form表单元素 1.获取表单上的form元素 1)document.getElementById() 2)document.forms 可以获得页面上所有的form元素,在这个集合中,可以通过数值索引或者表单的name属性来取得特定的表单.如: document.forms[0],docu

前端知识杂烩(Javascript篇)

1. JavaScript是一门什么样的语言,它有什么特点?2.JavaScript的数据类型都有什么?3.请描述一下 cookies,sessionStorage 和 localStorage 的区别?4.webSocket如何兼容低浏览器?(阿里)5.this和它声明环境无关,而完全取决于他的执行环境6.JavaScript异步编程常用的四种方法7.在严格模式('use strict')下进行 JavaScript 开发有神马好处?8.神马是 NaN,它的类型是神马?怎么测试一个值是否等于