理解 JavaScript 中的 `onblur` 事件
在 JavaScript 中，`onblur` 是一个事件处理器，用于处理元素失去焦点的情况，当一个元素失去焦点时，例如用户点击了页面的其他地方，或者在一个输入框中按下 tab 键跳转到下一个元素时，就会触发 `onblur` 事件。
在 HTML 中，你可以使用 `onblur` 属性来指定当元素失去焦点时要执行的 JavaScript 代码，如果你有一个输入框，你可以使用 `onblur` 属性来验证用户输入的数据：
<input type="text" id="myInput" onblur="validateInput()">
在这个例子中，当用户在输入框中输入数据并移开焦点时，会触发 `validateInput()` 函数。
在 JavaScript 中，你可以使用 `addEventListener()` 方法来添加 `onblur` 事件处理器。
var input = document.getElementById("myInput");
input.addEventListener("blur", validateInput);
在这个例子中，当输入框失去焦点时，会调用 `validateInput()` 函数，我们没有使用 `()` 来调用 `validateInput` 函数，因为我们希望将函数本身作为事件处理器传递，而不是调用该函数并传递其返回值。
`onblur` 事件处理器可以用于许多不同的用途，例如验证表单数据、保存用户输入的数据、隐藏或显示元素等，下面是一个简单的示例，演示如何使用 `onblur` 事件处理器来验证用户输入的电子邮件地址：
<input type="text" id="email" onblur="validateEmail()"> <p id="error" style="color: red;"></p>
function validateEmail() {
var input = document.getElementById("email").value;
var error = document.getElementById("error");
var emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (!emailRegex.test(input)) {
error.textContent = "请输入有效的电子邮件地址。";
} else {
error.textContent = "";
}
}
在这个例子中，当用户在输入框中输入电子邮件地址并移开焦点时，会触发 `validateEmail()` 函数，该函数获取输入框的值，并使用正则表达式来检查电子邮件地址是否有效，如果电子邮件地址无效，将在页面上显示错误消息；否则，将清除错误消息。
