prototype.jsリファレンス非同期通信(Ajax)
- Ajax.Response〔Ajax.Response〕
- 非同期通信のリクエスト数を取得〔activeRequestCount〕
- options
- 非同期通信で読み込んだデータをページに表示〔Updater〕
- 非同期通信〔Request〕
Ajax.Response
Ajax.Response
unknown
new Ajax.activeRequestCount;
| プロパティ | タイプ | 説明 |
|---|---|---|
| status | Number | The HTTP status code sent by the server. |
| statusText | String | The HTTP status text sent by the server. |
| readyState | Number | The request’s current state. 0 corresponds to 'Uninitialized', 1 to 'Loading', 2 to 'Loaded', 3 to 'Interactive' and 4 to 'Complete'. |
| responseText | String | The text body of the response. |
| responseXML | document Object or null | The XML body of the response if the content-type of the request is set to application/xml. null otherwise. |
| responseJSON | Object, Array or null | The JSON body of the response if the content-type of the request is set to application/json. null otherwise. |
| headerJSON | Object, Array or null | Auto-evaluated content of the X-JSON header if present. null otherwise. This is useful to transfer small amounts of data. |
| request | Object | The request object itself (an instance of Ajax.Request or Ajax.Updater). |
| transport | Object | The native xmlHttpRequest object itself. |
| メソッド | タイプ | 説明 |
|---|---|---|
| getHeader(name) | String or null | Returns the value of the requested header if present. null otherwise. Does not throw errors on undefined headers like it’s native counterpart does. |
| getAllHeaders() | String or null | Returns a string containing all headers separated by a line break. Does not throw errors if no headers are present like it’s native counterpart does. |
| getResponseHeader(name) | String | Returns the value of the requested header if present. Throws an error otherwise. This is just a wrapper around the xmlHttpRequest object’s native method. Prefer it’s shorter counterpart getHeader. |
| getAllResponseHeaders() | String | Returns a string containing all headers separated by a line break. Throws an error otherwise. This is just a wrapper around the xmlHttpRequest object’s native method. Prefer it’s shorter counterpart getAllHeaders. |
非同期通信のリクエスト数を取得
activeRequestCount
unknown
new Ajax.activeRequestCount;
サンプルを見る<p>
<input type="button" onclick="fUpdater('include/ajax/xmltodom/ranking.xml')" value="XMLデータ読込" />
<input type="button" onclick="fUpdater('index.rdf')" value="RDFデータ読込" />
<input type="button" onclick="fUpdater('index.html')" value="HTMLデータ読込" />
</p>
リクエスト数:<input type="text" id="res_requestcount" size="3" /> 回
<p>
<textarea id="res_text" style="width:90%; height:10em;"></textarea>
</p>
<script type="text/javascript">
function fUpdater(url){
new Ajax.Updater(
{ success:"res_text"},
url,
{
method: 'get',
onFailure:function(httpObj){
$("res_text").value="エラー発生";
}
}
);
$("res_requestcount").value=Ajax.activeRequestCount;
}
</script>
非同期通信で読み込んだデータをページに表示
Updater
unknown
new Ajax.Updater(container, url[, options]);
サンプルを見る<p>
<input type="button" onclick="fUpdater('include/ajax/xmltodom/ranking.xml')" value="XMLデータ読込" />
<input type="button" onclick="fUpdater('index.rdf')" value="RDFデータ読込" />
<input type="button" onclick="fUpdater('index.html')" value="HTMLデータ読込" />
</p>
<p>
▼文字列として取得:<br>
<textarea id="res_text" style="width:90%; height:10em;"></textarea>
</p>
<script type="text/javascript">
function fUpdater(url){
new Ajax.Updater(
{ success:"res_text"},
url,
{
method: 'get',
onFailure:function(httpObj){
$("res_text").value="エラー発生";
}
}
);
}
</script>
非同期通信
Request
unknown
new Ajax.Request(url[, options]);
サンプルを見る<p>
<input type="button" onclick="fRequest('include/ajax/xmltodom/ranking.xml')" value="XMLデータ読込" />
<input type="button" onclick="fRequest('index.rdf')" value="RDFデータ読込" />
<input type="button" onclick="fRequest('index.html')" value="HTMLデータ読込" />
</p>
<p>
▼文字列として取得:<br>
<textarea id="res_text" style="width:90%; height:10em;"></textarea>
</p>
<p>
▼XMLとして取得:<br>
<textarea id="res_xml" style="width:90%; height:10em;"></textarea>
</p>
<script type="text/javascript">
function fRequest(url){
new Ajax.Request(url,
{
method: 'get',
onSuccess:function(httpObj)
{
$("res_text").value=httpObj.responseText;
$("res_xml").value=httpObj.responseXML;
},
onFailure:function(httpObj)
{
alert("エラー発生");
}
}
);
}
</script>