jQuery AJAX技術被廣泛用于創建優質的Web應用程序。其中之一就是用它創建聊天室。下面我們來看看如何使用jQuery AJAX創建一個簡單的聊天室。

//設置變量
var i = 0;
var username = "";
//向服務器發送消息
$("button").click(function(){
$.ajax({
method: "POST",
url: "/chat",
data: { message: $("#message").val(), user: username }
})
.done(function( msg ) {
$("#message").val("");
});
});
//接收新的消息
setInterval(function(){
$.ajax({
method: "GET",
url: "/chat",
data: { count: i }
}).done(function( msg ) {
$("#chat").prepend(msg);
i++;
});
}, 3000);
//更新用戶名
$("#username").change(function(){
username = $(this).val();
});

以上代碼中，$.ajax 是用來向服務器發送和接收消息的函數。通過向服務器發送 POST 請求，我們可以將聊天室中的消息發送給服務器。服務器將這些消息存儲起來，以便其他人可以看到。而通過向服務器發送 GET 請求，我們可以定期地檢查是否有新的消息。我們一直在持續發送請求，以確保每個新的消息都被收到。
同時，我們還需要更新用戶名以便聊天室中的其他用戶知道你的名字。這是通過監聽 #username 的 change 事件來實現的。最后，我們將收到的消息插入到頁面中。