觸屏已經是我們身邊電子設備的常態了。觸摸事件當然也是隨著觸屏的出現，用戶使用最多的事件啦！
難道使用觸屏事件后，其他原來的鼠標事件就都不能用啦？當然不是，只不過不是那么好用啊。

針對鼠標事件，有哪些不適應？

dbclick

觸屏設備不支持雙擊事件。雙擊瀏覽器窗口，會放大畫面。

可以通過在head標簽內加上這么一行：

代碼如下:
<meta name="viewport" content="width=device-width, minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">

可以實現，我們編寫的頁面不會隨著用的手勢而放大縮小。

關于meta標簽，我還沒有研究過，罪過啊。

mouse

在觸屏上，我們單擊一個元素，會相應的觸發：mousemove mousedown mouseup click，所以當我們編寫移動客戶端界面時，可以為元素直接添加move事件，可以提高效率。

同時也會觸發mouseover與mouseout，測試結果，我發現，只有當頁面第一次刷新時，單擊元素，參會觸發mouseover事件。

隨著觸屏移動端設備的普及使用，W3C開始制定TouchEvent規范。

觸摸事件

該類事件會在用戶手指放在屏幕上面時，在屏幕上滑動時，或從屏幕上移開時觸發。具體來說有以下幾個觸摸事件。
1、touchstart

當手指放在屏幕上觸發。

2、touchmove

當手指在屏幕上滑動時，連續地觸發。

3、touchend

當手指從屏幕上離開時觸發。

4、touchcancel

當系統停止跟蹤時觸發，系統什么時候取消，文檔沒有明確的說明。

【總】以上四個，是w3c提供的觸摸事件，只針對觸摸設備，最常用的是前三個。

由于觸摸會導致屏幕動來動去，所以可以會在這些事件的事件處理函數內使用event.preventDefault()，來阻止屏幕的默認滾動。

除了常用的DOM屬性，觸摸事件還包含下列三個用于跟蹤觸摸的屬性。
1、touches：表示當前跟蹤的觸摸操作的touch對象的數組。

當一個手指在觸屏上時，event.touches.length=1,

當兩個手指在觸屏上時，event.touches.length=2，以此類推。
2、targetTouches：特定于事件目標的touch對象數組。

因為touch事件是會冒泡的，所以利用這個屬性指出目標對象。

3、changedTouches：表示自上次觸摸以來發生了什么改變的touch對象的數組。

每個touch對象都包含下列幾個屬性：
4、clientX：觸摸目標在視口中的x坐標。

clientY：觸摸目標在視口中的y坐標。