blur事件
blur事件是在元素失去焦点的时候触发,那么失去焦点的前提便是获得焦点。
哪些元素可以获取焦点呢?
1.超链接
2.input button textarea (without disabled)
3.所有带有tabindex属性的未被disabled的元素
例如:
<a href="#" onblur="showMsg(this);">link</a>
<input onblur="showMsg(this);" type="text" />
<input onblur="showMsg(this);" type="text" disabled />
<p onblur="showMsg(this);">first p</p>
<p onblur="showMsg(this);" tabindex="1">second p</p> <script>
function showMsg(e){
alert(e.tagName);
}
</script>
要注意的是 chrome下面 除了文本域的点击事件是不会触发focus和blur的 但是你使用tab键可以触发
jQuery中一样 API是将blur放在了form events下面
一般情况下给html element 加上tabindex是兼容主流浏览器的
blur事件的更多相关文章
- input 的blur事件之后button的onclick事件不执行解决方案
最近发现网页程序中有个BUG,就是在input标签输入框中输入完数据后,直接点击“取消” 按钮的时候.出现网页崩死的情况: 经过小主酸菜我,各种方法的尝试后,找到一个初步可以解决的方案,在这里分享给大 ...
- 说说focus /focusin /focusout /blur 事件
事件触发时间 focus:当focusable元素获得焦点时,不支持冒泡:focusin:和focus一样,只是此事件支持冒泡:blur:当focusable元素失去焦点时,不支持冒泡:focusou ...
- 【原】相煎何太急——input的blur事件与button的click事件
先来一段引子,最近在写手机h5页面,主要是一些登陆注册方面的,最绕不开的就是表单元素. 我想实现的是:在输入框后边有一个删除图标,当输入东西的时候触发事件,显示删除图标,点击该图标会删除之前输入的内容 ...
- jquery easyui textbox onblur事件,textbox blur事件无效解决方案
jquery easyui textbox onblur事件,textbox blur事件无效解决方案 >>>>>>>>>>>> ...
- div无法触发blur事件解决的方法
默认情况下div无法获取焦点,无法触发focus与blur事件,推測span,a等标签也无法触发焦点事件(input:button.及button标签能够触发) 怎样使div触发blur事件:能够给d ...
- focus、blur事件的事件委托处理(兼容各个流浏览器)
今天工作中遇到个问题,问题是这样的,一个form表单中有比较多的input标签,因为form中的input标签中的值都需要前端做客户端校验,由于本人比较懒而且特不喜欢用循环给 每个input元素添加b ...
- 吐血bug-- 多个input框接连blur事件导致alert接连弹出
本来今天想记录一下Flow在vue源码中的应用,结果临时触发了个bug... bug描述: elementUi + Vue 技术 需求:一个表格中有至少两条数据,每条数据都有input框,在失去焦点后 ...
- vue中mint-ui的filed的与blur事件结合实现检查用户输入是否正确
标题mint-ui的filed与blur事件验证用户输入格式是否正确说明:本人前端菜鸟,只是想借个地方做个笔记,为了以后查阅时比较方便.如有大神有什么建议的地方,欢迎提出来. 1.不得不说,mint- ...
- 下拉框click事件与搜索框blur事件的爱恨纠葛
还原车祸现场 功能类似于百度搜索,搜索框输入内容,下拉框显示候选项,点击候选项就选择候选项,然后下拉框隐藏,点击外面就直接隐藏下拉框,于是我写了以下代码 //参会单位联想 $('input[name= ...
随机推荐
- sharedMesh变量
在unity引擎中, 一般情况不建议用sharedMesh变量去写操作,建议只读,因为那会对mesh永久改变 变
- 基于 Consul 的 Docker Swarm 服务发现
Docker 是一种新型的虚拟化技术,它的目标在于实现轻量级操作系统的虚拟化.相比传统的虚拟化方案,Docker 虚拟化技术有一些很明显的优势:启动容器的速度明显快于传统虚拟化技术,同时创建一台虚拟机 ...
- MyBatis 学习-动态 SQL 篇
MyBatis 为我们提供了如下几个动态 SQL 元素: if choose foreach where/set trim 一.IF 元素 <select id="selectProj ...
- 推荐一个集成环境 XAMPP
摘自:http://blog.sina.com.cn/s/blog_72c4b92501012ll7.html 一个新手接触 Joomla! 的过程应该是这样的:看到这个词之后首先要弄明白“什么是Jo ...
- AngularJs中,如何在父元素中调用子元素为自定义Directive中定义的函数?
最近一段时间准备使用AngularJs中的自定义Directive重构一下代码. 在这里说明一下,把自定义控件封装成Directive并不一定是要复用,而是要让代码结构更加清晰.就好像你将一个长方法拆 ...
- jquery轻松实现li标签上下滚动的原理
在网站上我们常看到有滚动的文字或者图片,比如消息提醒,新闻列表,等等.那么这些效果是怎么形成的呢?经过查阅,找到一种十分方便的写法,经过改良,得出我自己的终极版滚动效果. 我先写个布局吧 <di ...
- 取消a标签在移动端点击时的背景颜色
一.取消a标签在移动端点击时的蓝色 -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-user-select: none; -m ...
- 为OLED屏增加GUI支持
为OLED屏增加GUI支持1:OLED驱动 为OLED屏增加GUI支持2:2D图形库 为OLED屏增加GUI支持3:字库 为OLED屏增加GUI支持4:文本框控件 为OLED屏增加GUI支持5:图片控 ...
- child_process小解
js是一种单进程单线程的语言,但现行的cpu都是多核的,为了解决单进程单线程对多核使用不足的问题,child_process应运而生,理想情况下每个进程各自利用一个内核. 主要有四种方法来创建子进程, ...
- ionic的弹出框$ionicPopover
在ionic.html中 在controller.js中