HTML onblur 事件
onblur 事件在元素失去焦点时触发。 onblur 常用于表单验证代码。
实例
当用户离开输入字段时对其进行验证：
<!DOCTYPE html><html><body>输入你的名称: <input type="text" name="fname" id="fname" onblur="myFunction()"><p>当焦点离开输入框时，会触发一个函数，将输入文本转换为大写。</p><script>function myFunction() {var x = document.getElementById("fname");x.value = x.value.toUpperCase();}</script></body></html>
浏览器支持
| 事件 | |||||
|---|---|---|---|---|---|
| onblur | Yes | Yes | Yes | Yes | Yes |
所有主流浏览器都支持 onblur 事件。
定义和用法
onblur 事件在元素失去焦点时触发。
onblur 常用于表单验证代码（例如用户离开表单字段）。
提示：onblur 事件与 onfocus 事件相反。
HTML 4.01 与 HTML5 之间的差异
无。
语法
<element onblur="script">
属性值
| 值 | 描述 |
|---|---|
| script | onblur 发生时运行的脚本。 |
更多实例
<!DOCTYPE html><html><body><p>当您输入字段时，将触发一个函数，该函数将背景色设置为黄色。离开输入字段时，会触发一个函数，将背景颜色设置为红色。</p>输入名称: <input type="text" id="myInput" onfocus="focusFunction()" onblur="blurFunction()"><script>// 聚焦 = 改变背景颜色为黄色function focusFunction() {document.getElementById("myInput").style.background = "yellow";}// 失焦 = 改变背景颜色为红色function blurFunction() {document.getElementById("myInput").style.background = "red";}</script></body></html>