关于 Zepto 的“点透”事件

zepto 的点透事件无非是上面元素的 tap 事件先于 click 事件执行。如果上面元素绑定的 tap 事件刚好是隐藏该元素的话,click 事 件就会结算在下面的元素上(相当于下面的元素被点击了)。

网上有一些还扯到了 tap 绑定在 document 上,事件冒泡 balabala...

如果你看到了这种文章,你一定看不懂。看不懂就对了,因为他就是错的,而且没说明白(说明白不就暴露他是错的了嘛)。

可以复制下面 HTML 中的代码,然后在 chrome mobile 模拟器上执行看一下。

click 和 touchend 事件分别绑定在下层元素和上层遮罩上。上层遮罩在 touchend 时会隐藏,随后 click 事件便触发在了下层元素上。下层元素 click 时会弹窗。整个 demo 并没有把事件绑定在 document 上,但一样有“点透”效果

See the Pen paPPER by yuhui (@dblate) on CodePen.