相信對于很多手機用戶而言，當手指不小心放在移動設備的屏幕上，不經意間滑動會觸發(fā)的touch事件是經常出現(xiàn)的。有很多人對這種現(xiàn)象會很反感，今天創(chuàng)新互聯(lián)的網(wǎng)站開發(fā)工程師則針對這個現(xiàn)象，憑借多年的經驗，為大家詳細的講解一下這個現(xiàn)象的出現(xiàn)原因，及有效的解決辦法，幫助大家更好的了解這些問題，解決這些問題。

以下支持webkit

再比如我們常見的taret而言，

以下支持winphone 8

MSPointerDown——當手指觸碰屏幕時候發(fā)生。不管當前有多少只手指

MSPointerMove——當手指在屏幕上滑動時連續(xù)觸發(fā)。通常我們再滑屏頁面，會調用css的html{-ms-touch-action: none;}可以阻止默認情況的發(fā)生：阻止頁面滾動

MSPointerUp——當手指離開屏幕時觸發(fā)

移動端click屏幕產生200-300 ms的延遲響應

移動設備上的web網(wǎng)頁是有300ms延遲的，玩玩會造成按鈕點擊延遲甚至是點擊失效。

以下是歷史原因，來源一個公司內一個同事的分享：

2007年蘋果發(fā)布首款iphone上iOS系統(tǒng)搭載的safari為了將適用于PC端上大屏幕的網(wǎng)頁能比較好的展示在手機端上，使用了雙擊縮放(double tap to zoom)的方案，比如你在手機上用瀏覽器打開一個PC上的網(wǎng)頁，你可能在看到頁面內容雖然可以撐滿整個屏幕，但是字體、圖片都很小看不清，此時可以快速雙擊屏幕上的某一部分，你就能看清該部分放大后的內容，再次雙擊后能回到原始狀態(tài)。

雙擊縮放是指用手指在屏幕上快速點擊兩次，iOS 自帶的 Safari 瀏覽器會將網(wǎng)頁縮放至原始比例，可能這個簡單的舉動對于更多的使用者而言，并沒有什么只是簡單便捷了一些，但是對于網(wǎng)站開發(fā)人員，尤其是多年從事手機網(wǎng)站開發(fā)的人來說卻是一件翻天覆地的變化。

原因就出在瀏覽器需要如何判斷快速點擊上，當用戶在屏幕上單擊某一個元素時候，例如跳轉鏈接<a href=”#”></a>，此處瀏覽器會先捕獲該次單擊，但瀏覽器不能決定用戶是單純要點擊鏈接還是要雙擊該部分區(qū)域進行縮放操作，所以，捕獲第一次單擊后，瀏覽器會先Hold一段時間t，如果在t時間區(qū)間里用戶未進行下一次點擊，則瀏覽器會做單擊跳轉鏈接的處理，如果t時間里用戶進行了第二次單擊操作，則瀏覽器會禁止跳轉，轉而進行對該部分區(qū)域頁面的縮放操作。那么這個時間區(qū)間t有多少呢？在iOS safari下，大概為300毫秒。這就是延遲的由來。造成的后果用戶純粹單擊頁面，頁面需要過一段時間才響應，給用戶慢體驗感覺，對于web開發(fā)者來說是，頁面js捕獲click事件的回調函數(shù)處理，需要300ms后才生效，也就間接導致影響其他業(yè)務邏輯的處理。

以上就是創(chuàng)新互聯(lián)的網(wǎng)站開發(fā)工程師為大家整理的關于移動端touch事件如何區(qū)分webkit與winponhe的相關介紹，以上都是創(chuàng)新互聯(lián)開發(fā)人員的經驗之談，希望可以在日后的網(wǎng)站開發(fā)中可以幫助到大家，為大家的網(wǎng)站建設有所幫助。

分享名稱：創(chuàng)新互聯(lián)為您帶來網(wǎng)站開發(fā)移動端touch事件解決方案
轉載來源：http://vcdvsql.cn/news26/322376.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供動態(tài)網(wǎng)站、企業(yè)建站、電子商務、網(wǎng)站導航、網(wǎng)站策劃、手機網(wǎng)站建設

廣告

聲明：本網(wǎng)站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)