奇怪的点击事件气泡在iPhone safari上，它在冒泡到document.body之前停止

Strange Click Event Bubble on iPhone safari that it stop before bubbling to document.body

本文关键字：document body 事件 气泡 safari iPhone      更新时间：2023-09-26

我已经将一个点击事件绑定为document.body.onclick=function（）｛alert（"aaa"）｝；

无论是在安卓系统上还是在IOS上，无论我点击什么元素，它都做得很好。但当点击除a和img元素之外的元素时，它不会在iPhone safari上触发。

但在绑定touchstart事件时，它可能会冒泡到主体上。

最后，我必须添加到div（#main）中以包含我的所有元素，然后将委托对象绑定到这个div上

document.querySelector（"#main"）.onclick=function（）｛alert（"aaa"）｝

所以我想知道为什么onclick事件在它冒泡到身体之前就停止了。

我知道这已经很旧了，但当我遇到同样的问题时，我还是设法把它挖了出来。

简而言之，除非iOS Safari认为事件目标是可点击元素，否则iOS Safari中的鼠标事件不会出现在document.body中。

可点击元素是以下元素之一：

  1. 事件的目标元素是链接或表单字段。

  2. 目标元素或之前但不包括<body>的任何祖先元素，都为任何鼠标事件设置了显式事件处理程序。此事件处理程序可能是一个空函数。

  3. 目标元素或它的任何祖先（包括文档）都有一个游标：指针CSS声明。

（从这里引用，重点是我的。）

可能的修复包括：

  • 将cursor: pointer添加到任何不符合描述的元素中
  • 向目标添加无操作事件处理程序
  • 处理document.body以下一级的单击
相关文章：