记一次移动端CSS引发的小Bug

记一次移动端CSS引发的小Bug

翻开我的博客，大部分都是关于知识点的总结、防混淆、查漏补缺的文章，没有什么关于实际操作的解决办法，刚好今天遇到了一些关于CSS的问题，稍稍记录下来，给我以后写实际操作的技术博客练手。

好吧，言归正传。今天要在一个H5页面中，添加一个点击事件。

很简单吧，但是这个点击事件的位置有点风骚，兄弟节点有点击事件，父节点也有点击事件。
怎么办呢？没问题，根据事件的三个阶段：捕获阶段，目标阶段，冒泡阶段如下图。

因为我使用JQ这样写：

$('body').on('click','.topics .topic .no-subscribe',function(event){
	...
}

意思是当事件冒泡到body的时候，才会触发。

所以，我们就要在达到目标阶段阻止冒泡。

$('body').on('click','.topics .topic .no-subscribe',function(event){
   event.stopPropagation();
   ......
  });

stopPropagation() 函数就是专门阻止事件在冒泡阶段继续冒泡的。

好了，我觉得这样完美。然而我还是太年轻。iOS那边点击不了，安卓却可以。

我们