.ajax() 是 jQuery 提供的一個方法，用于實現 Ajax 異步請求。在網頁中，用戶登錄是一個常見的功能。在傳統的登錄頁面中，用戶輸入用戶名和密碼后，點擊登錄按鈕，服務器后臺會進行驗證，驗證成功后將用戶信息返回給前端，前端再根據返回的用戶信息進行相應的操作，比如顯示歡迎用戶的姓名。而利用 Ajax 技術，可以在不刷新整個頁面的情況下完成登錄驗證和顯示歡迎用戶信息的操作。 舉個例子，假設有一個網站，用戶登錄后可以查看個人信息。傳統的登錄方式是用戶輸入用戶名和密碼，點擊登錄按鈕后，頁面會刷新，展示用戶的個人信息。而使用 Ajax 的方式，用戶在輸入完用戶名和密碼后，點擊登錄按鈕，網頁會發起一個 Ajax 請求，將用戶名和密碼傳遞給服務器進行驗證，并返回驗證結果。如果驗證成功，前端通過修改 DOM 元素的方式，將歡迎用戶的信息展示在頁面上，而不需要刷新整個頁面。這種方式給用戶帶來了更好的體驗，因為頁面無需刷新，用戶的操作流暢度得到提升。 下面是使用 Ajax 實現登錄并展示歡迎用戶信息的示例代碼：

HTML 代碼：

<form id="loginForm" method="post" action="/login">
<input type="text" name="username" id="username" placeholder="請輸入用戶名" />
<input type="password" name="password" id="password" placeholder="請輸入密碼" />
<button type="submit" id="loginBtn">登錄</button>
</form>
<div id="welcomeMsg"></div>

JavaScript 代碼：

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$('#loginForm').submit(function(event) {
event.preventDefault(); // 阻止表單默認提交行為
var username = $('#username').val();
var password = $('#password').val();
$.ajax({
url: '/login', // 請求的后端地址
type: 'post', // 請求類型為 POST
dataType: 'json', // 服務器返回的數據類型為 JSON
data: {
username: username,
password: password
},
success: function(response) {
if (response.success) {
$('#welcomeMsg').text('歡迎 ' + response.username + ' 登錄！');
} else {
alert('登錄失敗，請檢查用戶名和密碼！');
}
},
error: function() {
alert('請求失敗，請稍后重試！');
}
});
});
});
</script>

在上述代碼中，我們通過 jQuery 的 .ajax() 方法發起了一個 POST 請求，請求的地址為 "/login"，即后端提供的登錄驗證接口。請求的數據包括用戶名和密碼，通過鍵值對的形式傳遞給后端。 在請求成功（即后端返回了數據）時，通過檢查返回的數據中的 success 字段，判斷登錄是否成功。如果登錄成功，將返回的用戶名展示在 id 為 "welcomeMsg" 的 div 元素中，形成歡迎用戶的信息；如果登錄失敗，則彈出提示框。 需要注意的是，后端應該接收到前端傳遞的用戶名和密碼后進行驗證，并根據驗證結果返回相應的數據。在這個例子中，我們假設后端使用了 JSON 格式返回數據，其中 success 字段表示登錄是否成功，username 字段表示登錄成功后的用戶名。 以上示例代碼僅為演示 Ajax 登錄并展示歡迎用戶信息的基本流程，實際應用中可能還需要考慮更多的細節，比如表單驗證、安全性等。希望通過這篇文章，讀者可以對使用 Ajax 技術進行登錄驗證并展示歡迎用戶信息有一個初步的了解。