html登錄注冊驗證代碼是在網頁開發中常用的一個功能。下面將介紹如何使用html代碼實現登錄注冊驗證功能。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>登錄注冊驗證</title>
<script>
function checkLogin(){
var username=document.getElementById("username").value; //獲取用戶名
var password=document.getElementById("password").value; //獲取密碼
if(username=="admin"&&password=="123456"){ //判斷用戶名和密碼是否匹配
alert("登錄成功！");
return true;
}else{
alert("用戶名或密碼錯誤，請重新輸入！");
return false;
}
}
function checkRegister(){
var username=document.getElementById("username").value; //獲取用戶名
var password=document.getElementById("password").value; //獲取密碼
var repeat=document.getElementById("repeat_password").value; //獲取重復密碼
if(username=="admin"){ //判斷用戶名是否已存在
alert("用戶名已存在，請重新輸入！");
return false;
}else if(password!=repeat){ //判斷兩次密碼是否一致
alert("兩次密碼不一致，請重新輸入！");
return false;
}else{
alert("注冊成功！");
return true;
}
}
</script>
</head>
<body>
<form action="#" method="post">
<h2>登錄</h2>
<label>用戶名:</label><input type="text" id="username" name="username" required><br>
<label>密碼:</label><input type="password" id="password" name="password" required><br>
<input type="submit" value="登錄" onclick="return checkLogin()">
</form>
<form action="#" method="post">
<h2>注冊</h2>
<label>用戶名:</label><input type="text" id="username" name="username" required><br>
<label>密碼:</label><input type="password" id="password" name="password" required><br>
<label>重復密碼:</label><input type="password" id="repeat_password" name="repeat_password" required><br>
<input type="submit" value="注冊" onclick="return checkRegister()">
</form>
</body>
</html>在代碼中，利用javascript編寫了兩個函數，分別用于登錄和注冊功能的驗證。對于登錄功能，通過獲取用戶名和密碼的值，判斷是否與已定義的用戶名和密碼匹配。對于注冊功能，同樣獲取所填寫的用戶名和密碼，判斷用戶名是否已存在，兩次密碼是否一致，最后返回是否注冊成功的信息。
在登錄和注冊的表單中，設置了必填項，當未填寫或填寫格式不正確時，會出現提示信息。同時，在提交按鈕中加入驗證的函數名，以便執行驗證操作。