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="UTF-8">
<title>Document</title>
<style>
.box{
width: 200px;
height: 200px;
background-color: #3295F2;
}
</style>
<script type="text/javascript" src="http://sandbox.runjs.cn/uploads/rs/294/c4c2o6mh/jquery.js"></script>
</head>
<body>
<input type="text" />
<input type="button" value="測试" class="but"/>
<button>kkk</button>
<div class="box" tabindex="1"></div>
<script>
$('.box').focus(function(){
alert('div focus');
});
$('.box').blur(function(){
alert('div blur');
});
$('.but').focus(function(){
alert('but');
});
$('.but').blur(function(){
alert('but');
});
$('button').focus(function(){
alert('but');
});
$('button').blur(function(){
alert('but');
});
</script>
</body>
</html>
相关资料：http://www.w3school.com.cn/tags/att_standard_tabindex.asp
demo: http://www.w3school.com.cn/tiy/t.asp?
f=html_standard_tabindex
div无法触发blur事件解决的方法的更多相关文章
- div无法触发blur事件解决办法
默认情况下div无法获取焦点,无法触发focus与blur事件,猜测span,a等标签也无法触发焦点事件(input:button,及button标签可以触发) 如何使div触发blur事件:可以给d ...
- jquery 赋值时不触发change事件解决
$("#optionsId").change(function(){ $("#selectOptionsText").val('测试'); }); $(&quo ...
- blur([[data],fn]) 当元素失去焦点时触发 blur 事件。
blur([[data],fn]) 概述 当元素失去焦点时触发 blur 事件.大理石平台生产厂 这个函数会调用执行绑定到blur事件的所有函数,包括浏览器的默认行为.可以通过返回false来防止触发 ...
- vue -vantUI tab切换时 list组件不触发load事件解决办法
最近由于公司项目需要,用vue写了几个简单的页面.用到了vantUI List 列表 瀑布流滚动加载,用于控制长列表的展示 当列表即将滚动到底部时,会触发事件并加载更多列表项. (页面加载完成后默认会 ...
- 吐血bug-- 多个input框接连blur事件导致alert接连弹出
本来今天想记录一下Flow在vue源码中的应用,结果临时触发了个bug... bug描述: elementUi + Vue 技术 需求:一个表格中有至少两条数据,每条数据都有input框,在失去焦点后 ...
- jquery移除、绑定、触发元素事件
unbind(type [,data]) //data是要移除的函数 $('#btn').unbind("click"); //移除click $('#btn').unbind() ...
- uni-app中使用scroll-view滚到底部时多次触发scrolltolower事件
一.前言.scroll-view基本属性: 前言: 前段时间使用scroll-view可滚动视图区域容器来做多个不同内容的展示(在我这个页面中同时使用了三个scroll-view做数据展示),因为这几 ...
- input输入框change和blur事件区别
blur与change事件在绝大部分的情况下表现都非常相似,输入结束后,离开输入框,会先后触发change与blur,唯有两点例外. 1.没有进行任何输入时,不会触发change 在这种情况下失焦后, ...
- [Phonegap+Sencha Touch] 移动开发26 Android下的sencha touch程序，转屏时，Ext.Viewport不能触发orientationchange事件的解决的方法
Sencha touch 2.4.2 已经解决问题了. 比方你为Ext.Viewport的orientationchange事件加入了一个监听方法: Ext.Viewport.on('orientat ...
随机推荐
- cout输出各种进制
cout使用: int main(){ int a=10; cout<<"Dec:"<<a<<endl; cout<<hex&l ...
- 在VPS上安裝BT軟體Transmission
在VPS上安裝BT軟體Transmission 作者: 窮苦人家的小孩 | 2009-12-04 55 Comments VPS 還能怎玩?! 裝Proxy,裝VPN,這還不夠,我還用來掛種子 ...
- BeanFactory 和ApplicationContext
BeanFactory和ApplicationContext对待bean后置处理器稍有不同.ApplicationContext会自动检测在配置文件中实现了BeanPostProcessor接口的所有 ...
- Binary Tree Level Order Traversal II --leetcode C++
考察点 广度优先遍历--层次遍历 STL内容器的用法 广度优先遍历的时候,首先应该想到的就是借助于队列.还需要在遍历下一层之前保存当前层节点的数量 代码很简单: class Solution { pu ...
- JAVA的IO学习
IO 有具体的分类: 有具体的分类:1:根据处理的数类型不同:字节流和字符流.2:根据流向不同:输入流和输出流. =============(补充字节跟字符概念区分)================= ...
- 如何自定义iOS中的控件
本文译自 How to build a custom control in iOS .大家要是有什么问题,可以直接在 twitter 上联系原作者,当然也可以在最后的评论中回复我. 在开发过程中,有时 ...
- Cloudera Manager、CDH零基础入门、线路指导 http://www.aboutyun.com/thread-9219-1-1.html (出处: about云开发)
Cloudera Manager.CDH零基础入门.线路指导http://www.aboutyun.com/thread-9219-1-1.html(出处: about云开发) 问题导读:1.什么是c ...
- 新技能get: 使用whois查询不明网址的信息
1.站长之家-->Whois反查 http://whois.chinaz.com/ 进入whois.chinaz.com,输入要查询的网址,选择查询即可.
- ThinkPHP第四天(U函数，URL类型参数配置，伪静态后缀名配置，数据传递与获取$_GET等)
1.U('地址','参数','伪静态','是否跳转','是否显示域名'); 在模板中使用U方法而不是固定写死URL地址的好处在于,一旦你的环境变化或者参数设置改变,你不需要更改模板中的任何代码. 在模 ...
- android编程——百度地图初探
项目需要,花了一天时间研究了下百度地图的API,其实看起来可能会有点困难,但是将它的DEMO跑起来之后一切都迎刃而解的样子了.百度方面讲地图的接口封装的挺不错的,而且现在能够提供的地图的服务也有将近十 ...