IE10的bug?disabled button如何触发事件
最近碰到一个问题,IE10下的,貌似是个bug,求助!
问题表现为:在内部有dom元素的情况下,disabled状态的button会因为子元素的mouseover产生事件冒泡而触发,也就是说,disabled的button被触发了mouseover的事件。
这个“bug”只在IE10 或IE10下的IE9兼容模式出现。IE8以下和其它浏览器都没这个问题。
下面给出最小化事件的代码。
代码如下,请在IE10 下打开。
<html>
<head>
<style tyle="text/css">
</style>
</head>
<body>
<p><button onmouseover="alert('active button')" class="active">激活</button></p>
<p><button onmouseover="alert('disabled button1')" class="unactive" disabled> 未激活1</button></p>
<p><button onmouseover="alert('disabled button2')" class="unactive" disabled><span> 未激活2</span></button></p>
<p><button onmouseover="alert('disabled button3')" class="unactive" disabled><div> 未激活3</div></button></p>
<p><button onmouseover="alert('disabled button4')" class="unactive" disabled><span onmouseover="over();"> 未激活4(取消冒泡)</span></button></p>
<script type="text/javascript">
function over(evt){
if (window.event) {
event.cancelBubble = true;
}else if (evt){
evt.stopPropagation();
}
}
</script>
</body>
</html>
当鼠标移动到按钮1上的时候,mouseover并没有被触发。但是移动到2,3的时候,事件却被触发了!!。
而当鼠标移动到按钮4的时候,因为对内部的div的mouseover事件进行了处理,阻止了冒泡事件,因此没有被触发。
研究到这里,简单的想到对button内部的元素都这么处理就好了。刚好项目中用到jquery,如下。
$(’button span').bind('mouseover',function(evt){
if (window.event) {
event.cancelBubble = true;
}else if (evt){
evt.stopPropagation();
}
});
事实上,这段代码的确工作的很好。但是,项目中,大多数此类按钮都是通过ajax动态添加的。因此不能用bind方法。
也许这时候有人说通过live或者delegate方法去绑定。可是研究他们的机制就会知道,这两个方法本来就是依赖事件冒泡实现的。
因此,像各位求助,有什么好的解决方案吗?拜谢!
IE10的bug?disabled button如何触发事件的更多相关文章
- Asp.Net回车键触发Button的OnClick事件解决方案
在aspx页面有textbox文本框,还有三个button按钮.启用textbox的TextChanged事件和button的click事件. 问题: 现在在textbox文本框输入完数据按“回车”后 ...
- ListView中的组件Button的OnClick事件触发时机
Android开发时,ListView中的组件Button的OnClick事件必须在ListView之外的组件事件触发后才能触发? 此处ListView无OnItemClick事件,而且ListVie ...
- Jquery/js引入的button的onclik事件只触发一次
目标描述 我要实现的是:通过监听button的click事件,从而通过ajax向servlet发送请求获取数据库中的数据,然后返回的页面,并要求局部刷新 一次页面的加载是html直接页面初始化本身的 ...
- input 的blur事件之后button的onclick事件不执行解决方案
最近发现网页程序中有个BUG,就是在input标签输入框中输入完数据后,直接点击“取消” 按钮的时候.出现网页崩死的情况: 经过小主酸菜我,各种方法的尝试后,找到一个初步可以解决的方案,在这里分享给大 ...
- jQuery 滚动条 滚动到底部(下拉到底部) 加载数据(触发事件、处理逻辑)、分页加载数据
1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...
- jQuery实现按Enter键触发事件?
按Enter触发 $(function(){ document.onkeydown = function(e){ var ev = document.all ? window.event : e; ) ...
- es6 Object.assign ECMAScript 6 笔记(六) ECMAScript 6 笔记(一) react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式
es6 Object.assign 目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...
- jQuery-1.9.1源码分析系列(十) 事件系统——主动触发事件和模拟冒泡处理
发现一个小点,先前没有注意的 stopPropagation: function() { var e = this.originalEvent; ... if ( e.stopPropagation ...
- 【原】相煎何太急——input的blur事件与button的click事件
先来一段引子,最近在写手机h5页面,主要是一些登陆注册方面的,最绕不开的就是表单元素. 我想实现的是:在输入框后边有一个删除图标,当输入东西的时候触发事件,显示删除图标,点击该图标会删除之前输入的内容 ...
随机推荐
- SQL中游标的使用
一般情况下,我们用SELECT这些查询语句时,都是针对的一行记录而言,如果要在查询分析器中对多行记录(即记录集)进行读取操作时,则需要使用到游标或WHILE等循环 游标的类型: 1.静态游标(不检测 ...
- baiduMap 显示所有的marker(在视野里显示所有的)
搞Android的,所以比较幸苦和累现在搞的app是关于百度地图的,因为要求要把所有覆盖物显示在一个视野...所以在网上找了很久,终于找打了方法 我引用的包是: 记录一下,其实不算很难.一个小点.翻了 ...
- Stm32 定时器 定时时间设置及PWM频率 占空比的设置总结
一.定时器的时钟: 当SYSCLK等于72M,APB1等于36M APB2等于72M时,定时器的时钟为72M.注意图中这句话:如果APB1/APB2预分频器=1则频率不变,否则频率x2.如果此时,AP ...
- STL_iterator迭代器(3)——函数和函数对象
STL中,函数被称为算法,也就是说它们和标准C库函数相比,它们更为通用.STL算法通过重载operator()函数实现为模板类或模板函数.这些类用于创建函数对象,对容器中的数据进行各种各样的操作.下面 ...
- UVA 327 -Evaluating Simple C Expressions(栈)
Evaluating Simple C Expressions The task in this problem is to evaluate a sequence of simple C expre ...
- python模块之bsddb: bdb高性能嵌入式数据库 1.基础知识
转自:http://blog.csdn.net/zhaoweikid/article/details/1665741 bsddb模块是用来操作bdb的模块,bdb是著名的Berkeley DB,它的性 ...
- JavaScript实现自定义短信模板
自定义短信模板,要求:可以插入关键字,当然是可以在点击到文本域中的任意位置,关键字以中括号包裹的形式出现[关键字],删除关键字要整个关键都删掉,而不是自己全删除. 详细在简书中 http://www. ...
- Robotium--通过Id寻找控件
在自动化测试中,UI上经常有一些控件是没有名称的,那么此时,就可以通过id来找到这些控件. 案例:对两个EditText进行测试 package com.tangbc.tedit.test; impo ...
- [转] GPS坐标转换经纬度及换算方法
GPS坐标和经纬度的算法和概率不太一样,但是我们可能会将他们互通起来用,下面先贴上我做的转换工具:http://map.yanue.net/gps.html.里面实现了gps到谷歌地图百度地图经纬度的 ...
- Android - 消息机制与线程通信
以下资料摘录整理自老罗的Android之旅博客,是对老罗的博客关于Android底层原理的一个抽象的知识概括总结(如有错误欢迎指出)(侵删):http://blog.csdn.net/luosheng ...