最近碰到一个问题，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如何触发事件的更多相关文章

  1. Asp.Net回车键触发Button的OnClick事件解决方案

    在aspx页面有textbox文本框,还有三个button按钮.启用textbox的TextChanged事件和button的click事件. 问题: 现在在textbox文本框输入完数据按“回车”后 ...

  2. ListView中的组件Button的OnClick事件触发时机

    Android开发时,ListView中的组件Button的OnClick事件必须在ListView之外的组件事件触发后才能触发? 此处ListView无OnItemClick事件,而且ListVie ...

  3. Jquery/js引入的button的onclik事件只触发一次

    目标描述 我要实现的是:通过监听button的click事件,从而通过ajax向servlet发送请求获取数据库中的数据,然后返回的页面,并要求局部刷新 一次页面的加载是html直接页面初始化本身的 ...

  4. input 的blur事件之后button的onclick事件不执行解决方案

    最近发现网页程序中有个BUG,就是在input标签输入框中输入完数据后,直接点击“取消” 按钮的时候.出现网页崩死的情况: 经过小主酸菜我,各种方法的尝试后,找到一个初步可以解决的方案,在这里分享给大 ...

  5. jQuery 滚动条 滚动到底部（下拉到底部） 加载数据(触发事件、处理逻辑)、分页加载数据

    1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...

  6. jQuery实现按Enter键触发事件？

    按Enter触发 $(function(){ document.onkeydown = function(e){ var ev = document.all ? window.event : e; ) ...

  7. es6 Object.assign ECMAScript 6 笔记（六） ECMAScript 6 笔记（一） react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式

    es6 Object.assign   目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...

  8. jQuery-1.9.1源码分析系列（十） 事件系统——主动触发事件和模拟冒泡处理

    发现一个小点,先前没有注意的 stopPropagation: function() { var e = this.originalEvent; ... if ( e.stopPropagation ...

  9. 【原】相煎何太急——input的blur事件与button的click事件

    先来一段引子,最近在写手机h5页面,主要是一些登陆注册方面的,最绕不开的就是表单元素. 我想实现的是:在输入框后边有一个删除图标,当输入东西的时候触发事件,显示删除图标,点击该图标会删除之前输入的内容 ...

随机推荐

  1. 2014-08-22　关于Response、Request等对象在cs文件中的使用

    今天是在吾索实习的第33天.已经有一段时间没写过博客了,今天突然想起个值得分享的东西,所以又华丽地回归了. 废话不多说了,直奔主题.我们会发现,在我们在cs文件中,直接使用Response.Reque ...

  2. Visual studio 能否定位打开文件在项目中的位置

    文件位置:http://zhidao.baidu.com/link?url=FmwuCXTR2ptnRfqr7xGGPrnoXaONDAWgvO6iP4Dn736DwL7hEZCwQqanJbE0di ...

  3. 利用CSS边框合并属性打造table细边框

    CSS代码: <style> table{ border-collapse: collapse;/* 边框合并属性 */ width:200px; } th{ border: 1px so ...

  4. Haskell之Yesod开发–边踩坑边开发(2)

    今天继续上一节的开发 今天我们须要详细的开发一个图书馆站点,分为下面几个页面 / HomeR GET 主页 /login LoginR GET 用户登录页面 /library LibraryR GET ...

  5. iomanip

    在c++程序里面经常见到下面的头文件 #include <iomanip> io代表输入输出,manip是manipulator(操纵器)的缩写(在c++上只能通过输入缩写才有效.) 2作 ...

  6. [转] Gradle中的buildScript代码块

    PS: 在build script中的task apply plugin: 'spring-boot' 需要 classpath("org.springframework.boot:spri ...

  7. Java基础知识强化88：BigDecimal类之BigDecimal类引入和概述 以及 BigDecimal的使用（加减乘除）

    1. BigDecimal类概述: 由于在运算的时候,float类型和double很容易丢失精度.所以为了能够精确的表达.计算浮点数,Java提供了BigDecimal. BigDecimal:不可变 ...

  8. 解决从源码编译ncurses6.0编译lib_gen.c报错的问题

    直接从官网的源码编译时,会提示报错: gcc -DHAVE_CONFIG_H -I. -I../include -D_GNU_SOURCE -DNDEBUG -O2 --param max-inlin ...

  9. 关于 keybd_event （vb篇）

    最近有个VB的项目,做到64位的win7上,传统的VB6.0的sendkeys()函数没法用,可能是由于微软的证书验证机制造成的,于是最常用的一句话指令没法用了“SendKeys "{Hom ...

  10. 编程小计——消除Graphics图像边缘颜色不纯(抗锯齿)

    在很多时候,我们都要绘制纯色的图片,而用Graphics生成的往往是不纯的,尤其是绘制文字时.比如说绘制纯红色文字,往往R达不到255. C#中默认抗锯齿,给人看起来柔和:但是我们现实中往往用到锯齿. ...