觸控事件

撰寫可跨越多種行動裝置運作的觸控感知應用程式是可行的 觸控感知的桌面瀏覽器即將問世；現在就做好準備 最初出現於 iOS 2.0 版的 Mobile Safari 四種基本事件：touchstart touchmove touchend touchcancel 事件物件欄位：touches targetTouches changedTouches 修飾鍵（shift、alt、ctrl、meta）Touch 物件欄位：identifier clientX/Y pageX/Y screenX/Y 現已成為 W3C 工作草案 各廠商之間仍存在許多差異：touchenter / touchleave（Firefox、Blackberry）gesturestart / gesturechange / gestureend（Mobile Safari）MSPointer* / MSGesture*（IE10）擬真行為 具備替代輸入方式的裝置 多點觸控 FF6+ 支援 W3C 風格的觸控事件 IE10 具備 MSPointer* / MSGesture* WebKit 尚未支援 停用標準手勢處理（平移／縮放／滾動） 以及 document.body.addEventListener(‘touchmove’, function(event) { event.preventDefault(); }, false); 停用標準手勢處理（平移／縮放／滾動）在迴圈中處理渲染：var touches = [], // 此處也可使用 requestAnimationFrame() renderLoop = setInterval(function() { draw(touches); // 呼叫我們的繪製函式 }, 15); myElement.addEventListener(‘touchmove’, function(e) { touches = e.touches; }, false); 停用標準手勢處理（平移／縮放／滾動）在迴圈中處理渲染 支援單點觸控裝置（例如 Android 手機）停用標準手勢處理（平移／縮放／滾動）在迴圈中處理渲染 支援單點觸控裝置（例如 Android 手機）針對以下情況處理滑鼠事件：配備實體指標硬體的電話（例如許多 Android 手持裝置）不支援觸控事件的電話（例如 Windows Phone 7）不支援觸控功能的桌面瀏覽器（例如 Chrome）停用標準手勢處理（平移／縮放／滾動）在迴圈中處理渲染 支援單點觸控裝置（例如 Android 手機）處理滑鼠事件 支援具觸控功能的桌面瀏覽器：Firefox（W3C 風格觸控事件）IE10（MSPointer*）@ @ggoodale