`
hax
  • 浏览: 961468 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

IE模拟W3C事件模型的困难之处

    博客分类:
  • AJAX
阅读更多
原帖出自 http://www.iteye.com/topic/87329 的讨论。

legend 写道
我估计楼主是要在IE里模拟 capture,以楼主的 js 功力,模拟 capture 是轻而易举的!


模拟capture并非不可能,但是非常的麻烦。不是有js功力就一定可以搞定的。

比如,capture必须保持与bubble一个合理的触发顺序,你必须保证一个事件在dom树上完成所有注册的capture事件,然后再bubble。这点就非常头大了。例如我在div上capture一个click事件,我可以实际上先attach一个,但是我要保证在这个div上bubble的事件函数必须在capture的事件函数完成后再执行,这意味着普通的bubble事件函数也不能直接attach进去(否则无法保证执行顺序)。

进一步,如果我又在div的一个子元素span上capture一个click事件,那么同样的处理,但是我要保证先去触发外层div上的capture事件函数,然后是span上的capture事件函数,然后再是span上的bubble事件函数。问题是你还必须处理当click事件被bubble到div上后,不能把已经执行过的div上的capture事件再执行一遍!

好了,这只是基本的,再考虑一下cancel bubble,考虑一下stop propagation,考虑一下mousedown,click,mouseup,dblclick的事件顺序……
分享到:
评论

相关推荐

    Html之盒模型

    HTML的盒模型有两种类型:W3C标准盒模型和IE盒模型(也称为Quirks模式)。这两种模型的主要区别在于如何计算元素的总宽度和总高度。 - W3C标准盒模型:元素的总宽度和总高度由内容宽度+左右填充+左右边框+左右外边...

    JavaScript让IE浏览器event对象符合W3C DOM标准

    在JavaScript的世界里,不同的浏览器对事件处理有着不同的实现方式,其中IE浏览器的事件模型与W3C推荐的DOM(Document Object Model)事件模型存在差异。为了实现跨浏览器的兼容性,开发者经常需要对事件对象进行...

    IE8优化(模仿IE6)

    首先,我们需要理解IE8的改进之处。IE8引入了更好的CSS支持,包括CSS2.1和部分CSS3特性,提升了JavaScript性能,并且加强了安全特性,例如添加了严格的同源策略和反跨站脚本攻击(XSS)过滤。但这些改进可能导致一些为...

    IE7.JS解决IE兼容性问题方法

    2. **盒模型修复**:IE6和IE7的盒模型与W3C标准不一致,导致布局问题。IE7.js修复了这个问题,使得开发者可以按照标准盒模型进行布局。 3. **PNG透明度支持**:IE6不支持PNG24的透明效果,IE7.js提供了透明PNG的...

    div+css 完全兼容 样式兼容性 ie6 ie7 IE8 IE9 和firefox方法

    2. **盒模型兼容性**:IE6-8使用的是“怪异盒模型”,其中元素宽度包括了内边距和边框,而其他浏览器遵循W3C标准盒模型。解决方法是在CSS中使用`box-sizing:border-box;`或针对IE使用`*html`或`_width`前缀。 3. **...

    ie6-10兼容性解决-js.zip

    3. **CSS样式和盒模型**:IE6的盒模型与W3C标准不一致,导致布局计算问题。此外,IE6-8对CSS选择器和渐进增强的支持不足。 4. **PNG透明度支持**:IE6不支持PNG24位透明,需要特殊处理。 5. **JSON支持**:IE7及更...

    IE11没有window.attachEvent方法处理方法

    `attachEvent`是IE4至IE8特有的事件绑定方式,而`addEventListener`则是一种更通用、更符合W3C标准的方法,被现代浏览器广泛支持。当我们在IE11中尝试使用`attachEvent`时,会发现该方法并不存在。这是因为IE11已经...

    IE6 -- IE8浏览器CSS兼容性查询手册【gif格式】

    1. 盒模型:IE6和IE7默认采用“怪异盒模型”,其中content区域的宽度和高度不包括padding和border,这与W3C标准盒模型不符。在IE8(标准模式)和现代浏览器中,盒模型遵循W3C标准。开发者可以通过设置`box-sizing`...

    IE版本环境选择(IE4.5.6.7.8.9.11)

    但是,它对CSS2.1的一些关键特性支持不足,比如盒模型的处理与W3C标准不一致。 4. **IE8**:在2009年发布,开始支持DOCTYPE声明来触发标准模式,改善了对CSS2.1和部分CSS3的支持。它还引入了“IE8 Standards Mode”...

    js兼容ie8的选项卡.rar

    IE8默认使用怪异盒模型,与W3C标准的盒模型不同。在布局时,需明确设置`box-sizing:border-box`或`box-sizing:content-box`来保持一致性。 9. **文档模式**: IE8有多种文档模式,包括Quirks Mode、IE5 quirks、...

    IEtest 5-8 css样式兼容

    1. 盒模型:IE6和更早的版本使用了不同的盒模型,其中content区域的宽度和高度不包括边框和内边距,这与W3C标准盒模型不同,可能导致元素尺寸计算错误。 2. 浮动:IE的浮动元素可能会引起父元素高度塌陷,需要使用`...

    IE版本模拟器

    IE8是微软试图更加符合W3C标准的一个尝试,它提供了IE8标准模式和IE7兼容模式,以满足不同类型的网站需求。IE8全面支持CSS2.1,并部分支持CSS3,同时增强了JavaScript性能。对于开发者来说,确保在IE8上的表现良好...

    让ie兼容css选择器

    这些JavaScript库通常会模拟缺失的功能,使IE浏览器的行为更接近于符合W3C标准的现代浏览器。 ie7.js是一个由Dean Edwards开发的JavaScript库,它主要目的是让IE6和IE7支持一些CSS2.1及部分CSS3选择器,如类选择器...

    ie9.zip_ie7.js

    4. **盒模型修复**:解决IE特有的盒模型问题,使得布局计算更符合W3C标准。 5. **JSON支持**:为不支持JSON的IE版本添加解析和字符串化JSON的功能。 6. **错误修复**:修复一些已知的IE浏览器bug,如内存泄漏、...

    css 在ie7与ie8下的差别

    IE7默认采用的是“怪异盒模型”,其中content的宽度不包括边框和内边距,而IE8在标准模式下遵循W3C的盒模型,内容宽度包含边框和内边距。开发者可以通过`box-sizing`属性来控制盒模型的行为,但在没有此属性的情况下...

    ie6的调试工具

    在互联网的早期,IE6(Internet Explorer 6)是广泛使用的浏览器之一,尤其是在企业环境中。然而,由于其众多已知的兼容性和安全问题,开发者在创建网页时常常面临诸多挑战。在这种背景下,ie6的调试工具显得尤为...

    ie各版本兼容解决插件

    2. **DOM操作差异**:IE的文档对象模型(DOM)实现与W3C标准有较大出入,例如IE6不支持getElementsByClassName,而IE7开始支持的attachEvent与W3C的addEventListener事件处理函数不兼容。 3. **JavaScript引擎差异*...

    Javascript的IE和Firefox兼容性问题集合

    10. **盒模型**:IE使用怪异盒模型,而其他浏览器遵循W3C标准盒模型。在布局时,需要明确指定盒模型,如`box-sizing: border-box;`。 以上只是JavaScript在IE和Firefox之间兼容性问题的一部分,实际开发中可能还会...

    完美解决IE9浏览器出现的对象未定义问题

    在本文中,我们将深入探讨如何完美解决在Internet Explorer 9(IE9)浏览器中遇到的“对象未定义”错误。...不过,随着现代浏览器的广泛使用,尽可能地使代码符合W3C标准并兼容多种浏览器,是避免此类问题的长远之道。

    bootstarp 3.0兼容ie7

    2. **盒模型问题**: IE7使用不同的盒模型,即内容(content)、内边距(padding)和边框(border)合在一起计算宽度和高度,这与W3C标准不同。需要调整Bootstrap的CSS,确保元素的尺寸正确。 3. **响应式布局**: ...

Global site tag (gtag.js) - Google Analytics