読み込むファイルが存在しない場合にはエラー処理を行うことができます。Ajax.Requestの場合、onFailureの後にエラー処理を記述します。逆に成功した場合に処理させるにはonSuccessの後に実行する処理を記述します。onCompleteを使った場合、読み込みに成功しても失敗しても指定した処理が実行されます。このため、エラー結果の内容まで表示（取得）されてしまうので注意が必要です。
以下のサンプルはサーバー上にあるファイルと存在しないファイルを読み込み、ファイルが存在しない場合にはエラーメッセージを表示するものです。（サンプルを
実行する）
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>prototype.jsサンプル</title>
<script src="prototype.js" type="text/javascript"></script>
<script type="text/javascript"><!--
function loadFile(fName)
{
new Ajax.Request(fName, { method: 'get',
onSuccess: displayData,
onFailure:displayError
});
}
function displayData(httpObj)
{
$("result").innerHTML = httpObj.responseText;
}
function displayError()
{
$("result").innerHTML = "ファイルが読み込めません";
}
// --></script>
</head>
<body>
<h1>prototype.jsサンプル</h1>
<form>
<input type="button" value="sample.txtを読み込み" onClick="loadFile('sample.txt')">
<input type="button" value="存在しないファイルを読み込み" onClick="loadFile('ohmz.txt')">
</form>
<div id="result"></div>
</body>
</html>
指定したファイルをページ内に読み込むAjax.Updaterも同様にエラー処理を指定することができます。ただし、成功時に処理するためにsuccessを指定し、以後に表示先のIDを指定するようにします。（サンプルを
実行する）
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>prototype.jsサンプル</title>
<script src="prototype.js" type="text/javascript"></script>
<script type="text/javascript"><!--
function loadFile(fName)
{
new Ajax.Updater( {success : "result"},
fName, { method: "get",
onFailure:displayError
});
}
function displayError()
{
$("result").innerHTML = "ファイルが読み込めません";
}
// --></script>
</head>
<body>
<h1>prototype.jsサンプル</h1>
<form>
<input type="button" value="sample.txtを読み込み" onClick="loadFile('sample.txt')">
<input type="button" value="存在しないファイルを読み込み" onClick="loadFile('ohmz.txt')">
</form>
<div id="result"></div>
</body>
</html>
[
目次へ]
(2006.3.9)