簡易チャット

chatObj = new Object();
window.onload = function() {
// 書き込まれたデータをサーバーに保存
$("chatForm").onsubmit = function() {
var cName = $F("chatName");
var cMsg = $F("chatMsg");
var sendData = encodeURIComponent(cName+">"+cMsg);
new Ajax.Request("save.cgi?request="+sendData, {
method:"get",
onSuccess:chatObj.displayData });
$("chatMsg").value = "";
$("chatMsg").focus();
return false;
}
chatObj.dataReload();
}
// リロードして最新チャットデータを読み込む
chatObj.dataReload = function() {
var dateObj = (new Date()).getTime();
new Ajax.Request("sample.txt?cache="+dateObj, {
method:"get",
onSuccess:chatObj.displayData });
setTimeout("chatObj.dataReload()",1000);
}
// データをページ上に表示
chatObj.displayData = function(httpObj) {
var REbr = new RegExp(String.fromCharCode(10),"g");
var txt = httpObj.responseText.replace(REbr,"<br>");
if (txt != $("chatLog").innerHTML) $("chatLog").innerHTML = txt;
}
・サンプルを実行
・サンプルをダウンロード
Ajax実践テクニック 説明などは本書を参考にしてください。JavaScript以外のソースはデータをダウンロードするか本書を参照してください。