觸摸和指針事件

本章的前三節(jié)在InfoQ網(wǎng)站上有轉(zhuǎn)載。

觸摸事件為蘋果發(fā)明，它將觸摸和鼠標(biāo)兩種行為區(qū)分開，而微軟的指針事件則將它們合并，此標(biāo)準(zhǔn)更具前瞻性，現(xiàn)已加入肯德基豪華套餐被W3C采納為正式標(biāo)準(zhǔn)。

觸摸事件

1. touchstart
2. touchmove
3. touchend
4. touchcancel （不太被使用）

手勢(shì)事件：兩個(gè)或多個(gè)觸摸事件同時(shí)發(fā)生。僅Safari和IE支持，不建議使用。

實(shí)例

通過實(shí)例對(duì)比觸摸、指針事件與鼠標(biāo)鍵盤事件。

• 下拉菜單。對(duì)于用mouseover的下拉菜單，觸摸幾乎不可用。
• 拖拽。觸摸和鼠標(biāo)差不多，鍵盤難操作。
• 滾動(dòng)層。鼠標(biāo)難操作。

指針事件

指針事件合并了觸摸和鼠標(biāo)操作，它的必要性在于有一些超極本、平板電腦（Surface系列）同時(shí)支持觸摸和鼠標(biāo)操作，并且需要在兩者間進(jìn)行無縫的切換。

• pointerdown
• pointermove
• pointerup
• pointerover
• pointerout

觸摸事件的級(jí)聯(lián)

移動(dòng)瀏覽器同時(shí)支持觸摸事件和鼠標(biāo)事件，會(huì)導(dǎo)致一個(gè)觸摸動(dòng)作觸發(fā)多個(gè)事件。

• 觸摸（Tap）：touchstart/pointerdown、touchend/pointerup、mouseover、mousemove、mousedown、mouseup、click、:hover樣式（需要注意的是為了兼容mouseover，抬起手指并不會(huì)觸發(fā)mouseout，再次觸摸才會(huì)）
• 滑動(dòng)（Swipe）：touchstart、touchmove、touchend、scroll
• 縮放（Pinch）：touchstart、touchmove、touchend、scroll，可能還有resize
• 雙觸（double-tap）：touchstart、兩次touchend、scroll，可能還有resize
• 按住（touchhold）：touchstart、touchend，有些瀏覽器還有contextmenu

剖析click

300毫秒問題，無解。（Chrome支持但蘋果不可能支持）

使用指針事件

事實(shí)上因?yàn)榧嫒菪詥栴}，直到現(xiàn)在指針事件仍是不可用的，最好還是用蘋果的觸摸事件。