91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

如何在表單驗證中使用onblur事件

小樊
85
2024-06-27 20:13:24
欄目: 編程語言

在表單驗證中使用onblur事件可以在用戶離開輸入框時觸發驗證功能,確保用戶輸入的內容符合要求。以下是一個簡單的示例:

<form>
  <input type="text" id="username" onblur="validateUsername()">
  <span id="usernameError" style="color: red;"></span>
  <br>
  <input type="email" id="email" onblur="validateEmail()">
  <span id="emailError" style="color: red;"></span>
  <br>
  <button type="submit">提交</button>
</form>

<script>
function validateUsername() {
  var username = document.getElementById('username').value;
  var usernameError = document.getElementById('usernameError');
  
  if (username.length < 5) {
    usernameError.innerText = '用戶名至少需要5個字符';
  } else {
    usernameError.innerText = '';
  }
}

function validateEmail() {
  var email = document.getElementById('email').value;
  var emailError = document.getElementById('emailError');
  
  if (!email.includes('@')) {
    emailError.innerText = '請輸入有效的電子郵件地址';
  } else {
    emailError.innerText = '';
  }
}
</script>

在上面的示例中,我們在輸入框中添加了onblur事件來調用validateUsername()和validateEmail()函數,這兩個函數分別用于驗證用戶名和電子郵件格式是否符合要求。當用戶離開輸入框時,會觸發相應的驗證函數并在頁面上顯示錯誤信息。這樣可以在用戶填寫表單時及時提醒用戶輸入是否正確,提高用戶體驗。

0
怀集县| 康保县| 留坝县| 永济市| 泰和县| 临沂市| 嘉鱼县| 南部县| 清新县| 宁都县| 明溪县| 霸州市| 郑州市| 环江| 潮安县| 克什克腾旗| 株洲县| 靖州| 克东县| 洪雅县| 九寨沟县| 平乡县| 黄山市| 清远市| 梧州市| 荔浦县| 柘城县| 巨野县| 镇赉县| 麻城市| 安阳县| 靖宇县| 依安县| 吉木乃县| 海淀区| 岚皋县| 吴川市| 固安县| 乃东县| 吉安市| 乌什县|