记录-js事件监听的兼容性小集合

最新推荐文章于 2022-03-20 14:29:45 发布
最新推荐文章于 2022-03-20 14:29:45 发布
阅读量66 收藏
点赞数
分类专栏： js-event
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/haveadream66666/article/details/84383131
版权

 

  • 事件监听：

          ie使用attachEvent/detachEvent方法来添加和删除事件监听器；

          w3c使用addEventListener/removeEventListener方法

 

  •  type命名

          ie对事件类型使用on

 

  •  停止事件传递

          ie下是cancelBubble设置true

          w3c是stopPropagation

 

 
  • 阻止默认行为
          ie 要求是returnValue = false
          w3c是执行preventDefault
 
  • ie没有事件捕获阶段
 
  • ie在使用事件监听器方面存在内存泄露问题

 

  • ie将事件监听器当做一个独立的函数来调用----this关键字的指向不是事件发生对象而是一个没用的全局对象（window） 

          w3c是作为对象的方法来调用

haveadream66666
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JS常见的兼容性问题汇总
Calla_Lj的博客
04-26 3050
JS常见的兼容性问题 1） 滚动条： document.documentElement.scrollTop||document.body.scrollTop 获取样式兼容 function getStyle(dom, styleName){ return dom.currentStyle? dom.currentStyle[styleName] getComputedStyle(dom)[st...
javascript在事件监听方面的兼容性小结
10-29
javascript 在事件监听方面的兼容性总结，注意是由于多个浏览器的不一致，导致大家在js书写时需要考虑多个浏览器的兼容性。
js监听事件兼容写法
cuiwenlin的博客
03-27 616
var el= document.getElementById('el'); if(el.addEventListener) { el.addEventListener('click', function() { //逻辑语句 }) } else if (el.attachEvent){ //兼容ie8 el.attachEvent('onclick', functio...
JS事件监听的兼容写法
Anoddguy的博客
08-29 736
addEvent(goal,fn,'click',false); function addEvent(obj,fn,even,boolean){//封装一个自己的方法 if(obj.addEventListener){ obj.addEventListener(even,fn,boolean) } else{ ev='on'+even; ...
JS-DOM-监听事件
woshi6yi的博客
03-20 2715
一、 事件侦听注册事件 addEventListener (1) 里面的事件类型是字符串 必定加引号 而且不带on (2) 同一个元素 同一个事件可以添加多个侦听器（事件处理程序） 传统注册事件只能给一个元素注册一个同类型的事件 监听注册事件可以 二、删除事件 1.传统方式删除事件 事件 = null；（divs[0].onclick = null;） 2.监听事件删除 removeEventListener （divs[1].removeEventListener('click', fn)
js-Web-API-DOM-注册事件-addEventListener事件监听方式-删除事件的方式-DOM事件流-什么是事件对象-事件委托-鼠标事件对象
dream_vk的博客
07-02 256
注册事件(绑定事件) 1.1 注册事件概述 给元素添加事件，称为注册事件或者绑定事件。 注册事件有两种方式：传统方式和方法监听注册方式 传统注册方式 利用 on 开头的事件 onclick <button οnclick=“alert(‘hi~’)”> btn.onclick = function() {} 特点：注册事件的唯一性 同一个元素同一个事件只能设置一个处理函数，最后注册的处理函数将会覆盖前面注册的处理函数 方法监听注册方式 w3c 标准 推荐方式 addEventList.
JS的事件监听
Raccon_的博客
12-13 3315
事件 鼠标事件 1.onclick 鼠标点击左键触发 2.onmouseover 鼠标经过触发 3.onmouseout 鼠标离开触发 4.onmousemove 鼠标移动触发 5.onmouseup 鼠标弹起触发 6.onmousedown 鼠标按下触发 7.onfocus 获得鼠标焦点触发 8.onblur 失去焦点触发 注册事件 1.传统方式on开头的事件 element.οnclick=function(){} 注：注册事件有唯一性 同一个元素同一个事件只能设置一个处理函数，最后
h5前端兼容性问题及解决方法集合
醉逍遥neo的博客
05-20 2970
整理归纳一些之前记录的h5兼容性问题以及相应的解决方法，大多都是移动端的，持续更新… 1、iOS滑动卡慢 ios里父元素设置overflow:auto或scroll时，子元素滚动时没有滚动惯性，手指离开屏幕就立即停止滚动，所以会有一种卡和慢的感觉。 目前发现ios13及以上系统没有这个问题，但低版本的还会出现，需要解决。 解决方法： css里给滚动父元素设置： -webkit-overflow-scrolling: touch; 注意：这个css属性有很多坑，谨慎使用，例如会导致绝对定位元素会被父元
【兼容性】js 浏览器兼容问题处理方式
前端进阶之路 | 中大厂、外企、国企内推 | 面试培训 | 简历修改
02-26 3385
问题描述：兼容处理：问题描述：兼容处理：问题描述：在IE中这样写：document.getElementById(“header”).style.styleFloat = “left”;在Firefox中这样写：document.getElementById(“header”).style.cssFloat = “left”;兼容处理： （4）访问标签中的"for" 问题描述：在IE中这样写： 在Firefox中这样写: 兼容处理：问题描述：IE8.0之前的所有IE版本的写法： 适用于IE8.0 以及 fi
详解vue中v-on事件监听指令的基本用法
10-15
主要介绍了详解vue中v-on事件监听指令的基本用法，文中讲解非常细致，代码帮助大家更好的理解和学习，感兴趣的朋友可以了解下
jQuery-mobile事件监听与用法详解
11-26
本文实例讲述了jQuery-mobile事件监听与用法。分享给大家供大家参考，具体如下： 触摸事件 – 当用户触摸屏幕时触发（敲击和滑动） 滚动事件 – 当上下滚动时触发 方向事件 – 当设备垂直或水平旋转时触发 页面事件 ...
js事件监听机制(事件捕获)总结
12-04
添加事件的js方法也很多，有直接加到页面结构上的，有使用一些js事件监听的方法，由于各个浏览器对事件冒泡事件监听的机制不同，le浏览器只有事件冒泡，没有事件监听的机制，对于事件监听的兼容性问题是最大的难题：...
关于Windows 9x的vmm32问题解决方法
最新发布
06-15
关于Windows 9x的vmm32问题解决方法
Linux下用sdcc开发51单片机，该示例是中断处理程序.zip
06-15
该资源内项目源码是个人的课程设计、毕业设计，代码都测试ok，都是运行成功后才上传资源，答辩评审平均分达到96分，放心下载使用！ ## 项目备注 1、该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的，请放心下载使用！ 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习，也适合小白学习进阶，当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行，也可在此代码基础上进行修改，以实现其他功能，也可用于毕设、课设、作业等。 下载后请首先打开README.md文件（如有），仅供学习参考, 切勿用于商业用途。 该资源内项目源码是个人的课程设计，代码都测试ok，都是运行成功后才上传资源，答辩评审平均分达到96分，放心下载使用！ ## 项目备注 1、该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的，请放心下载使用！ 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习，也适合小白学习进阶，当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行，也可在此代码基础上进行修改，以实现其他功能，也可用于毕设、课设、作业等。 下载后请首先打开README.md文件（如有），仅供学习参考, 切勿用于商业用途。
施工作业人员配备与人员资格及职责分工表.docx
06-15
施工作业人员配备与人员资格及职责分工表.docx
Tangram-ES 0.17.1 64位 Debug/Release版 基于OpenGL地图渲染引擎
06-15
Tangram-ES 0.17.1 基于OpenGL ES地图渲染引擎 编译环境为Windows 10 Pro 22H2 + VS2022 + vcpkg 包管理器 编译结果包含64位 Windows平台 Release/Debug版 引擎使用imgui界面库显示地图瓦片，使用OpenGL ES库渲染画面
后端技术详细设计文档模板
06-15
后端技术详细设计文档 目录 1 引言 项目概述 设计目标 2 术语 3 设计概述 3.1 设计理念 3.2 设计方案 3.3 功能范围 4 系统架构 4.1 整体架构 4.2 功能架构 4.3 时序图 5 详细设计 6 数据结构设计 7 任务拆分
快应用---事件监听与触发
05-31
快应用中，可以通过事件监听与触发来实现组件间的通信。 首先，在要接收事件的组件中，需要使用 `$on` 方法进行事件监听。例如： ``` <template> <div> <button @click="triggerEvent">触发事件</button> </div> </template> <script> export default { methods: { triggerEvent() { this.$dispatch('myEvent', '这是传递的参数'); } } } </script> ``` 上述代码中，`triggerEvent` 方法通过 `$dispatch` 方法触发了一个名为 `myEvent` 的事件，并传递了一个参数。 接下来，在要触发事件的组件中，可以使用 `$on` 方法监听该事件，并在回调函数中处理事件。例如： ``` <template> <div> <p>{{ message }}</p> </div> </template> <script> export default { data() { return { message: '' } }, created() { this.$on('myEvent', (param) => { this.message = param; }); } } </script> ``` 上述代码中，`created` 钩子函数使用 `$on` 方法监听了名为 `myEvent` 的事件，并在回调函数中将传递的参数赋值给了 `message` 数据，从而实现了组件间的通信。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值