使用 HTML 點(diǎn)擊登錄時(shí),經(jīng)常需要進(jìn)行表單驗(yàn)證,驗(yàn)證的過程中需要用到 JavaScript 代碼。下面是一個(gè)簡單的 js 代碼示例,實(shí)現(xiàn)了一些基本的表單驗(yàn)證:
首先是 HTML 代碼,包括一個(gè)表單、一個(gè)用戶名輸入框、一個(gè)密碼輸入框和一個(gè)提交按鈕:
<form id="login"> <label>Username: <input type="text" id="username" name="username"></label> <label>Password: <input type="password" id="password" name="password"></label> <input type="submit" value="Login"> </form>然后是 JavaScript 代碼,驗(yàn)證用戶名和密碼是否已填寫,如果未填寫則會(huì)提示:
<script> var form = document.getElementById('login'); var username = document.getElementById('username'); var password = document.getElementById('password'); form.addEventListener('submit', function (event) { if (username.value === '' || password.value === '') { alert('Please enter your username and password.'); event.preventDefault(); } }); </script>這個(gè)簡單的示例只是一個(gè)表單驗(yàn)證的基礎(chǔ),但它可以讓您了解如何實(shí)現(xiàn) HTML 登錄表單驗(yàn)證。通過這個(gè)示例,您可以更深入地了解表單驗(yàn)證的工作原理,并了解如何添加其他屬性和規(guī)則,以進(jìn)一步增強(qiáng)網(wǎng)站的安全性。