$event.target有时获取的是当前元素的子元素

2020-04-30 08:58:59


解决办法,使用event.currentTarget

这就是事件冒泡,当一个元素触发事件后,会逐层上报给父元素、祖父元素……乃至document,也就是说这些元素都会同时触发事件。这种情况下,event.target就是指最初触发事件的那个子元素(就比如你题目中的img),而event.currentTarget才是被冒泡后触发事件的当前元素(比如li)。这也就意味着,当你点击li时,如果点到的是子元素img,则event.target就是img,而event.currentTarget则是li,而当你点到的是li里面除img之外的其他部分时,event.target和event.currentTarget都是li
所以,现在你知道该怎么做啦?就是不要使用event.target,改用event.currentTarget

  • 2018-03-04 10:15:33

    HTTP代理协议 HTTP/1.1的CONNECT方法

    我们平时使用HTTP协议无非就是GET、POST这些方法,但是HTTP的内容远不止那些。今天就来说说HTTP代理使用的CONNECT。这个不是在网页开发上用的,如果没兴趣就跳过吧。

  • 2018-03-05 11:30:04

    iOS wkwebkit 播放HTML5 视频 全屏问题解决

    使用html5 的video标签播放视频的时候,限制视频的尺寸,在android上是没有问题的,但是在ios上发现,视频没有开始播放的时候还是好的,但是一旦播放开是,就会全屏,非常奇怪。

  • 2018-03-07 14:35:32

    centos7下yum安装ffmpeg

    安装EPEL Release,因为安装需要使用其他的repo源,所以需要EPEL支持 yum install -y epel-release

  • 2018-03-08 09:44:12

    前端性能监控:window.performance

    Web Performance API允许网页访问某些函数来测量网页和Web应用程序的性能,包括 Navigation Timing API和高分辨率时间数据。

  • 2018-03-08 09:44:15

    前端性能监控:window.performance

    Web Performance API允许网页访问某些函数来测量网页和Web应用程序的性能,包括 Navigation Timing API和高分辨率时间数据。