在移動(dòng)端頁面進(jìn)行優(yōu)化時(shí)，一般使用touch事件替代鼠標(biāo)相關(guān)事件。用的較多的是使用touchend事件替代PC端的click和mouseup事件。
可是，touchend事件在頁面滾動(dòng)時(shí)有個(gè)問題。在滾動(dòng)完畢后，假設(shè)當(dāng)前觸點(diǎn)的位置所指的元素綁定了touchend事件，這時(shí)便會(huì)觸發(fā)該元素的touchend事件，造成誤操作，相當(dāng)煩人。
思路：就是在頁面滾動(dòng)時(shí)停止touchend事件冒泡。這樣就能夠防止觸發(fā)touchend事件。
解決方案（直接引用）：
function stopTouchendPropagationAfterScroll(){
? ? var locked = false;
? ? window.addEventListener('touchmove', function(ev){
? ? ? ? locked || (locked = true, window.addEventListener('touchend', stopTouchendPropagation, true));
? ? }, true);
? ? function stopTouchendPropagation(ev){
? ? ? ? ev.stopPropagation();
? ? ? ? window.removeEventListener('touchend', stopTouchendPropagation, true);
? ? ? ? locked = false;
? ? }
}
stopTouchendPropagationAfterScroll();
額外提醒：
在移動(dòng)端，scroll事件是在滾動(dòng)結(jié)束后才會(huì)觸發(fā)一次。而touchmove事件是在滑動(dòng)過程中多次觸發(fā)。使用scroll會(huì)比使用touchmove在性能上有一定優(yōu)化。
可是。上面代碼之所以不用scroll事件，而用touchmove事件。是為了同一時(shí)候適用于小于一個(gè)屏幕高度的頁面。所以也是不得已使用touchmove。
