如何解决浏览器事件绑定兼容问题

最新推荐文章于 2021-09-23 15:45:39 发布
最新推荐文章于 2021-09-23 15:45:39 发布
阅读量326 收藏
点赞数 2
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43516282/article/details/89976800
版权

通过判断浏览器环境是否为IE浏览器环境以此选择绑定的事件，使用if-else判断语句实现
在这里插入图片描述

方法详解：
addEventListen(没有’on’的事件：如click，执行的函数，true或false)，最后参数为true时为捕获机制，否则为冒泡机制，默认为false
attachEvent（带’on’的事件：如onclick，执行的函数）

月下影＆心上人
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
【事件绑定的方式】兼容浏览器的事件监听器的设计
heshan1992的博客
08-19 402
一、兼容浏览器的事件监听器 主要是兼容IE8以前的浏览器，addEvent方法中介绍了三种绑定事件的方式，其中要注意： （1）在IE的事件绑定方式中，事件处理函数里面的事件对象时挂在window上面的，所以获取event对象时需要利用window.event来获取 （2）addEventListener添加监听器时注意事件的冒泡和事件的捕获，即该方法的第三个参数，事件的冒泡和捕获注意的事项参见
浏览器兼容性--绑定事件
zhangting8_的博客
11-06 502
addEventListener(this)中的this 是绑定事件的对象 attachEvent(this)中的this 是 window   需要统一两个方法的this function bind (obj,eventStr,callback){ if(obj.addEventListener){//大部分浏览器有这个属性 //大部分浏览器兼容方式 obj.addEventListe...
兼容浏览器的js事件绑定函数
hsd2012的专栏
03-29 1843
因为javascript中所有对象都集成与Object，那么只有给Object原型添加一个事件绑定函数，就不需要在处理绑定事件的时候，每次写一长串代码，直接调用即可。在代码中添加红色部分代码，直接便可以在代码中直接调用 nihaoa /** *@param ev事件 @param fn 函数**/Object.prototype.addListener=function(ev,fn){if
JS-浏览器事件绑定兼容性问题
m0_48683643的博客
10-05 233
前端笔记-浏览器事件绑定兼容性问题1.代码演示：2.代码优化: 1.事件绑定与解绑:  绑定事件时:  能使用addEventListener方法绑定的，就采用此方法.  否则采用attachEvent方法绑定  解绑事件时:  能用removeEventListener方法绑定就用。  否则就用detachEvent方法绑定。 1.代码演示： 代码如下（示例）： //例.html部分 <div style="width:200px;height:200px;backgro
自定义浏览器事件绑定函数
divi
06-26 300
function bind(el, eventType, callback) { if (typeof el.addEventListener === 'function') { el.addEventListener(el, eventType, callback, false); } else if (typeof el.atteachEvent === 'function')...
jQuery解决浏览器兼容性问题案例分析
10-22
在Web开发中，浏览器兼容性问题一直是个...这使得开发者能够专注于应用逻辑，而不是花费大量时间在解决浏览器兼容性问题上。通过学习和使用jQuery，开发者可以提高工作效率，同时确保应用在各种浏览器上的良好运行。
JS兼容所有浏览器的DOMContentLoaded事件
11-30
针对旧版IE浏览器的兼容性问题，我们可以采用一种称为“doScroll检测”的技巧。由于IE浏览器的特殊性，当DOM结构加载完成后，可以尝试执行`document.documentElement.doScroll('left')`而不会引发错误。因此，我们...
even事件浏览器兼容性实例介绍
09-25
在本实例中，我们将深入探讨“even”事件，特别是如何处理浏览器兼容性问题，以及如何在用户在文本框中按下回车键时调用特定函数`doquery()`。这个例子涉及到两种不同的方法来实现这个功能，确保在各种浏览器环境下...
各种浏览器兼容问题
12-07
关于用脚本设置onload事件句柄 ... [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]关于用脚本绑定事件句柄 IE 下用 attachEvent， FF 下用 addEventListener相关讨论如下：http://search.blueidea.com/?q=addE
img onload事件绑定各浏览器均可执行
09-05
以下是一种跨浏览器兼容的解决方案： ```html window.onload = function() { var img = document.getElementById('imgId'); var src = img.getAttribute('src'); img.setAttribute('src', ''); // 重置图片源...
IE兼容事件绑定V1.0
bangxing1210的博客
04-09 100
想要兼容IE678，少用原型，因为它们没有完全实现ECMA-262规范 1 (function(window){ 2 //兼容IE678时少用原型，因为它没有完全遵循ECMA-262规范 3 4 //衬垫代码：isArray方法的兼容方案 5 if (!Array.isArray) { 6 Array.isA...
跨兼容浏览器的事件处理程序
Jour的博客
03-31 459
从事前端开发工作的童鞋们，肯定会遇到浏览器事件处理兼容问题。从DOM0级事件处理程序到DOM2级事件处理程序。以及IE这个永恒的话题。下面是兼容所有浏览器的时间处理程序，包含添加、删除、阻止冒泡、取消默认行为、获取事件对象event、获取事件目标方面，直接上码：(function(){ var EventUitl = { addHandler : function(eleme
浏览器兼容性及处理方案 小结
DOM曼珠沙华的博客
06-01 405
浏览器兼容性问题，往往是个别浏览器对一些标准定义不一致导致的。 常用的浏览器及对应内核如下： 浏览器 内核 IE Trident Firefox Gecko chrome 先为webkit，后为blink（与opear共同开发） Safari webkit Opear blink CSS兼容性问题 浏览器兼容性导致的问题： 1.不同浏览器对解析标签默认的内边距和外边距不同 解决方式：*{ margin: 0; padding: 0;} 2.IE6双边距问题；在 IE6中设
解决浏览器事件绑定兼容性问题
小白小白从不日别的博客
09-23 253
这里主要是针对DOM2级事件，对于HTML事件和DOM0级事件在非IE和IE下都能得到支持，因此这里只实现对DOM2级事件的兼容性处理和封装 思路： 绑定事件：如果能使用addEventListener方法绑定的，就采用本方法；否则采用attachEvent方法 解绑事件：如果能采用addEventListener方法绑定的，就采用removeEventListener方法解绑；否则就采用detachEvent方法解绑 伪代码： function addEvent(ele){
浏览器事件兼容性问题
weixin_30825581的博客
06-16 80
一、背景透明的元素在 ie 里 加不上事件的解决方法 　　场景： <div class="box"> <div class="box_bj"></div> <!--box_bj 为宽高自适应父级大小,背景透明 --> </div> <script type="text/javascript"> ...
浏览器默认绑定事件
huanghai的专栏
11-25 520
event.preventDefault() ：该方法用于通知web浏览器阻止
怎么解决事件绑定的兼容性问题
baozhuona的博客
11-26 1973
怎么解决事件绑定的兼容性问题
事件绑定的多种形态解决多种形态的浏览器兼容性问题(以及attachEvent中this指向的改变)
海空的博客
10-23 533
第一个种形态: 事件绑定的基本语法 与概念  :使用    对象.事件=函数  的形式绑定响应函数,它只能同时为一个元素的一个事件绑定一个响应函数,不能绑定多个,如果绑定 多个,则后边面的会覆盖掉前面的那个 代码示范区:  //为btn01绑定一个单击响应函数 /*btn01.onclick = function(){ alert(1); };*/ //为btn01绑定第二个响
兼容绑定事件的3种方法
我的博客
08-29 1546
一、直接绑定(不利于UI和代码分离,event详见后面） 二、DOM事件句柄 document.getElementById("divid").onclick = function(){}; 三、侦听函数var tb = document.getelementbyid("tab1"); if(window.event){// 只有ie下，event是window的对象属性，注意两
前端常见的浏览器兼容问题
最新发布
05-24
4. 事件兼容：不同浏览器对事件的支持也有所不同，比如IE浏览器对事件的绑定方式和事件对象的属性方法不同。 5. 插件兼容：某些浏览器不支持某些插件，比如Flash等，需要提供不同的解决方案。 针对这些兼容性问题...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值