前端js之event事件(一)

前言:有些事情看上去简单甚至于平淡无奇,比如说爱情或者我们的生活可实际上却很复杂。js里面的event也是一样,不信就打印一下一个平淡无奇的onclick里面包含的event,只要在方法内传入参数event,或者e,还有ev然后打印,你就会发现一个新的天地。

核心内容:多种事件的运用场景解析

开始了

1吹牛逼

2吹牛逼

3也许我别来,你自然无恙

A:复杂多样的鼠标事件

应用:鼠标事件很多,平时用个点击就以为用过那就大错特错了,鼠标事件不仅有原生的点击,双击,移动,进入,移出,悬浮,可以打印event里面的type查看,还有一些比如jq封装的事件,这些事件而且会相互触发,比如移动move是最容易被其他事件触发,或者原生的拖拽事件,不仅有自己的事件,而且会触发元素上的很多其他事件。

B:为什么会这样呢?

解析:第一本身不同事件类型但是相近的鼠标操作就会同时触发,第二在多层dom结构中的事件,由于本身事件的冒泡机制,由最底层的元素向上冒泡,到父元素到document到window,以至于类似事件不同方法但是同时触发

C:怎么解决

办法:比如现象一:只想触发最底层的元素的点击事件,不触发其父元素的点击事件,解决方案阻止冒泡。现象二:类型相近事件相互触发,导致方法重复执行,解决方案在易促发的事件的方法中可以加入条件判断,是否已经执行过相同操作,如果有要么直接return,如果还有其他操作判断,可以将可能重复的那个操作进行重置。现象三:原生方法事件以及简单事件相互交叉影响导致最后鼠标事件失灵,定义的方法不能执行,页面不可控制,解决方案单个功能实现后进行方法设为null如dom.onclick=null,然后设置dom对象释放捕获。

event事件实在太多太复杂了,正如人生一样,可是有时候多一点细心多一点耐心,没事多打打断点和测试,我们会看得更加清晰,正如我若别来,你自然无恙,越是纠结,越是沉沦,往往简单最好。

事件人生,人生事件,简单复杂,复杂简单,一正一反,经历了自然会成长,花香了自然蝶飞舞。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 总结: 鼠标事件 1.click与dbclick事件$ele.click()$ele.click(handler(...
    阿r阿r阅读 5,527评论 2 10
  • (续jQuery基础(1)) 第5章 DOM节点的复制与替换 (1)DOM拷贝clone() 克隆节点是DOM的常...
    凛0_0阅读 5,186评论 0 8
  • 三千年后从青铜鼎上起身,梵文经卷不情愿地松开我的紫云袍,滑落至青白玉石板上,将紧那罗的曼妙舞姿恰到好处地欲盖弥彰。...
    16夜月阅读 2,707评论 0 0
  • 书自开启至读毕,一月有余,借口甚蕃,不以为怠慢之由,时日过久,需慎思。 “幼学”,意指孩童时的...
    爱吃咸奶油的小书生阅读 4,371评论 2 0
  • 原题 设计一个算法,并编写代码来序列化和反序列化二叉树。将树写入一个文件被称为“序列化”,读取文件后重建同样的二叉...
    Jason_Yuan阅读 4,965评论 0 0