FastClick使用之trigger觸發click失效

最近爲了提高web app在ios上的點擊效率,使用了FastClick.js,效果很明顯,基本是點擊後立馬有反饋。但是發現一個問題,在使用模擬點擊的時候,並不能觸發點擊的目的。javascript

$("#btn").trigger("click");//模擬點擊css

而以上代碼,在安卓上,卻能正常觸發。html

因而百度查找了相關的資料,找到如下內容(引用自http://amazeui.org/1.x/javascript/fastclick/)java

不該用 FastClick 的場景ios

 

桌面瀏覽器web

若是 viewport meta 標籤 中設置了 width=device-width, Android 上的 Chrome 32+ 會禁用 300ms 延時;瀏覽器

 Copyapp

<meta name="viewport" content="width=device-width, initial-scale=1">iphone

viewport meta 標籤若是設置了 user-scalable=no,Android 上的 Chrome(全部版本)都會禁用 300ms 延遲。ide

IE10 中,能夠使用 css 屬性 -ms-touch-action: none 禁止元素雙擊縮放(參考文章)。

根據上面描述,終於知道在安卓之因此能生效,是由於屬於FastClick不該用的場景,而IOS則應用上了FastClick的效果。因而跟蹤代碼,各類調試,發現了在ios上,須要調用「模擬兩次觸發」才能完成一次真正的點擊事件;

因而寫了以下擴展:

var notNeed = FastClick.notNeeded(document.body);

$.fn.triggerFastClick=function(){

    this.trigger("click");

        if(!notNeed){

        this.trigger("click");

    }

}

須要用到模擬點擊事件的時候,就使用$("#btn").triggerFastClick()來代替原來的trigger("click");

轉載自 http://www.2cto.com/kf/201509/442506.html

相關文章
相關標籤/搜索