JavaScript onblur 事件

JavaScript onblur 事件（event）用來監聽元素的失焦情況，失焦的意思指的是失去焦點，瀏覽器是根據網友的滑鼠游標聚焦至其他元素時，認定原本的元素失焦，舉例來說，當網友填寫會員表單中的其中一個欄位，填寫完成後自然就會跳至下一個欄位繼續填寫，無論是使用鍵盤上的 Tab 鍵，還是使用滑鼠將游標移至下一個欄位，原本填寫的那個欄位就算是失焦，若設計師有在原本填寫的那個欄位安插 onblur 事件，就能觸發特定的 JavaScript function 去做一些工作，onblur event 標準寫法是全部用英文小寫，不建議寫成 onBlur。

JavaScript onblur 事件語法

onblur="將觸發的 javascript function"

onblur 可以用在許多網頁元素中，常見的應用如文字輸入欄位 input text、textarea 等，onblur 的工作是＂判斷網友是否有產生對某元素產生失焦的動作＂，當狀況發生時，onblur 必須觸發 JavaScript 的 function 去執行其他程式碼，onblur 的工作就算完成了。

JavaScript onblur 事件範例

以上範例輸出

請輸入您的名子：
請輸入您的興趣：

此範例是一個非常簡單的 onblur 應用，在姓名的文字輸入欄位程式碼中，安插了一個 onblur 去監聽當網友填寫完後，游標離開姓名填寫欄位時，就觸發預先準備好的 JavaScript ShowName 函式，將剛剛填寫的姓名 alert 出來，整個範例的運作就是這麼簡單。ShowName 函式中的 alert 是 JavaScript 標準的跳出對話視窗語法，至於如何取得填寫的姓名資料則是使用 DOM 的 document.getElementById 方法。

延伸閱讀