隨著互聯網的快速發展，現在人們在網上交流的方式也日益多樣化和自由化。其中，在線聊天成為了人們最常用的溝通方式之一。為了實現實時聊天的效果，前端開發人員常常會使用Ajax技術。本文旨在介紹使用Ajax實現在線聊天的源代碼，并通過舉例來說明其實現原理。

假設我們有一個簡單的網頁，上面有一個文本框用于輸入聊天內容，并有一個按鈕用于發送信息。接下來，我們將通過Ajax技術實現當用戶點擊發送按鈕時，將用戶輸入的內容發送給服務器，并實時將服務器返回的聊天信息顯示在網頁上。

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$("#sendButton").click(function() {
var message = $("#messageInput").val(); // 獲取用戶輸入的聊天內容
$.ajax({
url: "chat.php", // 服務器端處理聊天信息的文件
type: "POST",
data: {message: message}, // 將聊天內容作為參數傳遞給服務器
success: function(response) {
$("#chatBox").append("<p>" + response + "</p>"); // 將服務器返回的聊天信息追加到聊天框中
}
});
});
});
</script>

在上面的代碼中，我們首先引入了jQuery庫，然后通過$(document).ready()方法將代碼包裝在一個回調函數中，確保JavaScript代碼在頁面加載完畢后執行。

在回調函數中，我們使用了一個點擊事件處理程序。當用戶點擊發送按鈕（id為sendButton）時，該事件將被觸發。在事件處理程序中，我們獲取了用戶在文本框（id為messageInput）中輸入的聊天內容，并將其保存在變量message中。

接下來，我們使用了$.ajax()方法來發送異步HTTP請求。該方法接受一個包含相關參數的對象作為參數。在這里，我們指定了請求的url為chat.php，請求的類型為POST，并將用戶輸入的聊天內容通過data參數傳遞給服務器。

當服務器返回響應時，成功的回調函數（success）將會被調用。在這里，我們將服務器返回的聊天信息追加到聊天框（id為chatBox）中，以便用戶能夠實時看到最新的聊天內容。

上述代碼僅為演示目的，實際使用中，你需要根據自己的需求和服務器端處理程序進行相應的修改。此外，為了確保安全，你還需要進行一些輸入驗證和數據過濾。

總之，通過使用Ajax技術，我們可以輕松地實現在線聊天功能。用戶輸入的聊天內容可以通過異步請求發送到服務器，并實時將服務器返回的聊天信息顯示在網頁上。希望本文可以幫助你理解Ajax在在線聊天中的應用。