js-解決移動端點擊事件的延遲問題

標籤：div   dev   tag   word   device   art   端點   XML   取消   

眾所周知，在手機上的點擊事件會有延遲300ms的問題。但在做手機端某些點擊小遊戲時，我們就需要取消這個延遲的問題；

第一步：禁止頁面的縮放

1. <meta name="viewport" content="width=device-width user-scalable= ‘no‘">  

這塊內容能解決一些部分手機的問題

 

第二步： fastclick.js

         FastClick 是 FT Labs 專門為解決移動端瀏覽器 300 毫秒點擊延遲問題所開發的一個輕量級的庫。簡而言之，FastClick 在檢測到touchend事件的時候，會通過 DOM 自訂事件立即觸發一個類比click事件，並把瀏覽器在 300 毫秒之後真正觸發的click事件阻止掉。使用方法如下。

      1：在頁面中引入fastclick.js檔案。

      2：在js檔案中添加以下代碼
      在 window load 事件之後，在body上調用FastClick.attach()即可。

       window.addEventListener(function(){   

            FastClick.attach( document.body );  

       },false );

 

       如果使用了jquery外掛程式

        $(function() {    

             FastClick.attach(document.body);    

        }); 

 

   我這邊代碼用到的

<script src="js/fastclick.js"></script>

// 處理移動端 click 延遲
if (‘addEventListener‘ in document) {
       document.addEventListener(‘DOMContentLoaded‘, function() {
       FastClick.attach(document.body);
       }, false);
 }

js-解決移動端點擊事件的延遲問題