### 說明: - on(event, handler) 是 jQuery 中一個通用的事件綁定方法,它可以用來綁定各種事件,不僅僅是點擊事件。這個方法的**第一個參數是要處理的事件類型,第二個參數是事件處理器(handler)。** - `on`與 click 事件類似,不過它的特殊性為,綁定在某個元素上時,它可以支持多個以上的事件類型: - 使用 click(handler) 時,**你僅能指定點擊事件的處理器**,而 on(event, handler) 允許你在一個地方集中處理多個事件,這樣的設計使得代碼更具擴展性和可讀性。你可以按照需求添加或移除事件,而不必在每次操作時都寫不同的綁定代碼。 ### 範例: - HTML: ```html <button id="myButton">Click me!</button> ``` - JavaScript & jQuery: - 如下所示: 該元素我綁定了兩筆事件類型 1. 點下按鈕時,產生文字訊息 2. 滑鼠移動進去時,觸發文字訊息 - [mouseenter event](https://developer.mozilla.org/zh-CN/docs/Web/API/Element/mouseenter_event) ```js $(document).ready(function () { // 選擇按鈕元素,綁定點擊事件處理器 $("#myButton").on({ // 每個 on(第一個參數為事件類型 , 第二個參數為事件處理器(handler)) click: () => { // 點擊觸發事件 console.log("Button clicked!"); }, mouseenter: () => { // 滑鼠移動到目標時觸發事件 console.log("Mouse entered!"); }, }); }); ``` ### 結語: - 總的來說,click 是 on 的一個簡化形式,用於特定的點擊事件情境。而 on 則為更廣泛的使用情境提供了更多彈性。