通常我們會遇到這樣的需求，導航選單在滑鼠劃過的時候顯示自定義彈層，在彈層中有一些連結需要點選後跳轉或者其他一些事件。比如：
$(".menu li").on("mouseover", function(){
var el = $(this);
el.find(".dropdown").show();
});
$(".menu li").on("mouseout", function(){
var el = $(this);
el.find(".dropdown").show();
})
在pc端中沒任何問題，但是不做任何自適應處理放到移動端就會產生一些問題：
- 原本的mouseover事件自動變成了click事件
- dropdown中的連結只要在點選第二次的時候才會觸發跳轉
第一個問題是因為mouse*是滑鼠事件，專門為滑鼠設計的，而mouseover/out等事件則會被手指的點選所觸發。所以在移動端開發的時候要儘可能拋棄傳統的mouseoveer/out等事件，用Touch事件或者更高階的Gesture事件來代替。
第二個問題就有意思了，無論是通過a標籤的href屬性做跳轉還是改為js跳轉全部都要執行第二次才能觸發，開始以為是css偽類把原本的事件阻止了，於是把hover樣式去掉，發現問題依舊。因為專案為移動pc自適應，所以固執的想要用一套程式碼解決這個問題。
既然移動端能很好的響應touch事件，那就同時加上click和touchend（jquery自帶），哪個生效執行哪個，試試，果然好了。
將原本的連結跳轉改為js跳轉：
$(".dropdown li a").on("click touchend", function(){
// do something
})