通过fastclick源码分析彻底解决tap“点透”(3)
};
这个方法用于判断是否需要用到fastclick，注释的意思不太明白，我们看看代码吧
首先一句：
if (typeof window.ontouchstart === 'undefined') {
return true;
}
如果不支持touchstart事件的话，返回true
PS：现在的只管感受就是fastclick应该也是以touch事件模拟的，但是其没有点透问题
后面还判断了android的一些问题，我这里就不关注了，意思应该就是支持touch才能支持吧，于是回到主干代码
主干代码中，我们看到，如果浏览器不支持touch事件或者其它问题就直接跳出了
然后里面有个deviceIsAndroid的属性，我们跟去看看（其实不用看也知道是判断是否是android设备）
FastClick.prototype.deviceIsAndroid = navigator.userAgent.indexOf('Android') > 0;
绑定事件
好了，这家伙开始绑定注册事件了，至此还未看出异样
if (this.deviceIsAndroid) {
layer.addEventListener('mouseover', this.onMouse, true);
layer.addEventListener('mousedown', this.onMouse, true);
layer.addEventListener('mouseup', this.onMouse, true);
}
layer.addEventListener('click', this.onClick, true);
layer.addEventListener('touchstart', this.onTouchStart, false);
layer.addEventListener('touchmove', this.onTouchMove, false);
layer.addEventListener('touchend', this.onTouchEnd, false);
layer.addEventListener('touchcancel', this.onTouchCancel, false);
具体的事件函数在前面被重写了，我们暂时不管他，继续往后面看先（话说，这家伙绑定的事件够多的）
stopImmediatePropagation
完了多了一个属性：
阻止当前事件的冒泡行为并且阻止当前事件所在元素上的所有相同类型事件的事件处理函数的继续执行.
如果某个元素有多个相同类型事件的事件监听函数,则当该类型的事件触发时,多个事件监听函数将按照顺序依次执行.如果某个监听函数执行了 event.stopImmediatePropagation()方法,则除了该事件的冒泡行为被阻止之外(event.stopPropagation方法的作用),该元素绑定的其余相同类型事件的监听函数的执行也将被阻止.
<html>
<head>
<style>
p { height: 30px; width: 150px; background-color: #ccf; }
div {height: 30px; width: 150px; background-color: #cfc; }
</style>
</head>
<body>
<div>
内容版权声明：除非注明，否则皆为本站原创文章。