JS事件類型

Web瀏覽器中可能發生的事件有很多類型，下面是幾種常用的事件類型：

   UI事件，焦點事件，鼠標與滾輪事件，鍵盤與文本事件，復合事件變動事件，HTML5事件設備事件，觸摸與手勢事件。

  UI 事件：UI事件中UI即(User Interface,用戶界面)，當用戶與頁面桑拿的元素交互時觸發。

1.UI事件中主要包括load,unload,abort,error,select,resize,scroll事件。

1.load事件

　　　此事件為當頁面完全加載完之后（包括所有的圖像、js文件、css文件等外部資源），就會觸發window上面的load事件。

　　　這個事件是JavaScript中最常用的事件，比如我們經常會使用window.onload=function(){};這種形式，即當頁面完全加載完之后執行其中的函數。

2.unload事件

　　　顯然，這個事件是與load事件相對的。在文檔被完全卸載后觸發。用戶從一個頁面切換到另一個頁面就會觸發unload時間。利用這個事件最多的情況是清楚引用，避免內存泄漏。

　　　這個事件同樣有兩種方式來指定。一種是JavaScript方式，使用EventUtil.addHandler()；另一種就是在body元素中添加一個特性。

　　   值得注意的是，一定要小心編寫onload事件中的代碼，因為它是在頁面卸載后才觸發，所以說頁面加載后存在的那些對象，在onload觸發之后就不一定存在了！

3.resize事件

　　  當調整瀏覽器的窗口到一個新的寬度或高度時，就會觸發resize事件。這個事件在window（窗口）上面觸發。因此同樣可以通過JS或者body元素中的onresize特性來指定處理程序。　

4.scroll事件

　　這個事件會在文檔被滾動期間重復被觸發，所以應當盡量保持事件處理程序的代碼簡單。

第二部分：焦點事件

　　焦點事件會在頁面元素獲得或失去焦點時觸發。主要有下面幾種：

• blur   在元素失去焦點時觸發。這個事件不冒泡，所有瀏覽器都支持。
• focus   在元素獲得焦點時觸發。這個事件不冒泡，所有瀏覽器都支持。
• focusin  在元素獲得焦點時觸發。這個事件冒泡,某些瀏覽器不支持。
• focusout 在元素失去焦點時觸發。這個事件冒泡，某些瀏覽器不支持。

　　注意：即使blur和focus不冒泡，也可以在捕獲階段偵聽到他們。

第三部分：鼠標與滾輪事件

　　鼠標事件是Web開發中最常用的一類事件，因為鼠標是最主要的定位設備。

• click---用戶單擊鼠標左鍵或按下回車鍵觸發
• dbclick---用戶雙擊鼠標左鍵觸發。
• mousedown---在用戶按下了任意鼠標按鈕時觸發。
• mouseenter---在鼠標光標從元素外部首次移動到元素范圍內時觸發。此事件不冒泡。
• mouseleave---元素上方的光標移動到元素范圍之外時觸發。不冒泡。
• mousemove---光標在元素的內部不斷的移動時觸發。
• mouseover---鼠標指針位於一個元素外部，然后用戶將首次移動到另一個元素邊界之內時觸發。
• mouseout---用戶將光標從一個元素上方移動到另一個元素時觸發。   
• mouseup---在用戶釋放鼠標按鈕時觸發。

 

第四部分：鍵盤和文本事件

• 　　該部分主要有下面幾種事件：

  1. keydown：當用戶按下鍵盤上的任意鍵時觸發。按住不放，會重復觸發。
  2. keypress:當用戶按下鍵盤上的字符鍵時觸發。按住不放，會重復觸發。
  3. keyup:當用戶釋放鍵盤上的鍵時觸發。
  4. textInput:這是唯一的文本事件，用意是將文本顯示給用戶之前更容易攔截文本。

  這四個事件在用戶通過文本框輸入文本時才最常用到。

 參考：https://www.cnblogs.com/zhuzhenwei918/p/6142228.html