jQuery是一個廣受歡迎的JavaScript庫，可以方便地處理HTML文檔，捕獲事件、創建動畫效果以及簡化AJAX交互。通過使用jQuery的強大功能，您可以輕松地實現用戶登錄系統。
以下是一個包含jQuery的登錄表單示例代碼：
<!DOCTYPE html>
<html>
<head>
<title>jQuery登錄示例</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function() {
$('#loginForm').submit(function(event) { // 當用戶提交表單時執行以下代碼
event.preventDefault(); // 防止表單提交
var username = $('#username').val();
var password = $('#password').val();
if (username == 'admin' && password == '123456') { // 模擬驗證用戶名和密碼
alert('歡迎回來！');
window.location.; // 跳轉到儀表板頁面
} else {
$('#errorMessage').text('用戶名或密碼錯誤').show();
}
});
});
</script>
</head>
<body>
<h1>登錄</h1>
<form id="loginForm">
<label for="username">用戶名:</label>
<input type="text" id="username" name="username"><br>
<label for="password">密碼:</label>
<input type="password" id="password" name="password"><br>
<span id="errorMessage" style="color: red; display: none;"></span><br>
<button type="submit">登錄</button>
</form>
</body>
</html>在這個示例中，當用戶提交表單時，通過防止表單提交，可以使用jQuery捕獲表單提交事件，獲取用戶名和密碼輸入，模擬驗證用戶名和密碼，如果驗證通過，就跳轉到儀表板頁面。如果驗證不通過，顯示錯誤消息。
通過使用jQuery登錄表單，您可以快速為您的網站實現一個完整的用戶認證系統，并為用戶提供更好的交互體驗。
上一篇jquery 的迭代
下一篇jquery 登錄樣式