すでにFirefoxで動作するAjaxコードで体験しました。これは以下のコードでした。(
実行する)
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
<title>XMLHttpRequest()の基本</title>
<script type="text/javascript"><!--
function loadTextFile()
{
httpObj = new XMLHttpRequest();
httpObj.onload = displayData;
httpObj.open("GET","data.txt",true);
httpObj.send(null);
}
function displayData()
{
document.ajaxForm.result.value = httpObj.responseText;
}
// --></script>
</head>
<body>
<h1>XMLHttpRequest()の基本 (IE以外)</h1>
<form name="ajaxForm">
<input type="button" value="読み込み" onClick="loadTextFile()"><br>
<textarea name="result" cols="40" rows="5"></textarea>
</form>
</body>
</html>
このコードをInternet ExplorerやAjaxに対応できないブラウザではエラーが発生してしまいます。エラーが発生するのは良くありませんので、HTTP通信が可能な場合だけ処理を行い、そうでない場合にはエラーメッセージを表示するようにします。エラーにも対応させたプログラムが以下のものになります。(
実行する)
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
<title>XMLHttpRequest()サンプル</title>
<script type="text/javascript"><!--
function loadTextFile()
{
httpObj = null;
try {
httpObj = new XMLHttpRequest();
}
catch(e) {
document.ajaxForm.result.value = "HTTP通信ができません";
}
if (httpObj != null)
{
httpObj.onload = displayData;
httpObj.open("GET","data.txt",true);
httpObj.send(null);
}else{
document.ajaxForm.result.value = "HTTP通信ができません";
}
}
function displayData()
{
document.ajaxForm.result.value = httpObj.responseText;
}
// --></script>
</head>
<body>
<h1>XMLHttpRequest()サンプル</h1>
<form name="ajaxForm">
<input type="button" value="読み込み" onClick="loadTextFile()"><br>
<textarea name="result" cols="40" rows="5"></textarea>
</form>
</body>
</html>
さきほどのプログラムではInternet Explorerではエラーが発生していましたが、このプログラムではテキストエリアに通信不能であると表示されエラーが発生しません。エラーの発生を防ぐためにtry...catchを使ってエラー表示を回避します。このtry...catch命令は、エラーが発生する可能性がある部分をtry { ... } で囲みます。もしエラーが発生した場合には一番近いcatch(){ ... }に処理をうつします。このcatchのブロックでエラー発生時の処理を行います。catch(e)とすると引数eにはエラー情報が渡されます。try...catchは何重にも入れ子（ネスト）することができます。
このプログラムはFirefox, Safari, Operaで動作しますが、一番シェアの多いWindows版Internet Explorerでは動作しません。そこで次にInternet Explorerでは、どのように記述すればよいかを説明します。
[
4:Internet Explorerの場合のデータの受け取り方へ]
[
目次へ]
(2005.12.16)