一.click與300ms延遲
hammer.js綁定tap事件過後會在觸發之後再次觸發一個點擊事件
在我們給遮罩綁定tap事件的時候如果遮罩下面恰好是一個a標籤那麼就會出現點擊遮罩頁面跳轉的情況
二.點擊穿透問題
點擊穿透現象有三種
*點擊穿透問題：點擊蒙層（mask）上的關閉按鈕，蒙層消失後發現觸發了按鈕下面元素的click事件
蒙層關閉按鈕綁定的是touch事件，而按鈕下邊元素綁定的是click事件，touch事件觸發之後，蒙層消失了，300ms後這個點的click事件fire，event的target自然就是按鈕下面的元素，因爲按鈕跟蒙層一起消息了。
*跨頁面點擊穿透事件：如果按鈕下面恰好是一個href屬性的a標籤，那麼頁面就會法神跳轉，因爲a標籤跳轉默認是click事件觸發，所以原理和上面的完全相同
*另一種跨頁面點擊穿透問題：這次沒有mask了，直接點擊頁內按鈕跳轉至新頁，然後發現新頁面中對應位置元素的click事件被觸發
和蒙層的道理一樣，js控制頁面跳轉的邏輯如果是綁定在touch事件上的，而且新頁面中對應位置的元素綁定的是click事件，而且頁面在300ms內完成了跳轉，三個條件同時滿足，就出現這種情況了
非要細分的話還有第四種，不過概率很低，就是新頁面中對應位置元素恰好是a標籤，然後就發生連續跳轉了。。。諸如此類的，都是點擊穿透問題
三.爲什麼會出現點透
click延遲、延遲、還是延遲
在移動端不使用click而用touch事件代替觸摸是因爲click事件有着明顯的延遲，具體touchstart與click的區別如下：
*touchstart：在這個DOM（或者冒泡到這個DOM）上手指觸摸開始即能立即出發
*click：在這個DOM（或者冒泡這個DOM）上手指觸摸開始，且手指未在屏幕上移動（某些<a href=”http://www.it165.net/edu/ewl/” target=”_blank” class=”keylink”>瀏覽器</a>允許移動一個非常小的位移值），且在這個DOM元素上手指離開屏幕，且觸摸和離開屏幕之間的間隔時間較短（某些瀏覽器不檢測間隔時間，也會觸發click）才能觸發
也就是說，事件的觸發事件按照由早到晚排列爲：touchstart早於touchend早於click。亦即click的觸發是有延遲的，這個時間大概在300ms左右（即使給元素綁定的是touch事件，touchstart=>touchend=>click，click事件依然會被觸發）
由於我們在touchstart階段就已經隱藏了罩層A，當click被觸發的時候，能夠被點擊的元素則是罩層下面的B元素綁定的事件，根據click事件的觸發規則：
只有在被觸發的時候，當前有click事件的元素顯示，且在面朝用戶的最前端時，纔出發click事件。
由於B綁定了click事件（或者B本身默認存在click事件），所以B的click事件被觸發，產生了點透的情況。
四.解決方案
最開始我是在hammer綁定的tap事件裏面調用阻止瀏覽器默認行爲和事件的相關方法 然後再次測試發現沒有效果
然後我就思考了一下試了一下給我綁定hammerJs的節點再綁定一個touchend事件經過測試發現完美解決了那個問題
值得注意的是一定要給addEventListener事件的第三個參數添加爲false 並且 touchend事件一定要在hammerJs綁定的tap事件之後添加否則無法解決tap點擊穿透的問題hammer的其他事件沒有進行測試不知道會不會有相同的問題