事件處理

使用者在網頁上的每個動作都是「事件」：點擊、打字、移動滑鼠、送出表單。 用 JavaScript 監聽這些事件，就能做出互動效果。

• click = 點擊
• input = 輸入中（即時觸發）
• submit = 表單送出
• mouseover / mouseout = 滑鼠移入/移出
• addEventListener() = 綁定事件監聽器

點擊計數器

即時搜尋篩選

表單送出攔截

AI 協作：學了這個，跟 AI 怎麼配合？

事件處理是讓網頁「活起來」的關鍵。AI 幫你寫事件監聽，你定義「什麼事件做什麼事」。

你的人類優勢：

• 你知道使用者會怎麼操作（點擊、輸入、滾動、hover）
• 你能定義互動的邏輯流程（點按鈕 → 送出表單 → 顯示成功訊息）

可以這樣跟 AI 說：

幫我做一個即時搜尋功能：使用者在搜尋框打字時（input 事件），即時篩選下方的商品列表。

練習題