❮ Prototype 和 AJAX 教程 Prototype 和 AJAX 教程 ❯

Prototype - AJAX Response() 方法

更新于 2025/1/30 16:22:17

此 AJAX Ajax.Response 是作为所有 Ajax 请求回调的第一个参数传递的对象。

这是本机 xmlHttpRequest 对象的包装器。它规范了跨浏览器问题，同时通过 responseJSON 和 headerJSON 属性添加了对 JSON 的支持。

Ajax.Response 对象的属性

属性	类型	描述
status	数字	服务器发送的 HTTP 状态代码。
statusText	字符串	HTTP 状态服务器发送的文本。
readyState	Number	请求的当前状态。 0 对应于"未初始化"，1 对应于"正在加载"，2 对应于"已加载"，3 对应于"交互"，4 对应于"完成"。
responseText	字符串	响应的文本主体。
responseXML	document 对象或 null	如果请求的内容类型设置为 application/xml，则为响应的 XML 主体。否则为 null。
responseJSON	对象，数组或 null	如果请求的内容类型设置为 application/json，则为响应的 JSON 主体。否则为 null。
vertical-align:middle;">headerJSON	对象，数组或 null	如果存在，则自动评估 X-JSON 标头的内容。否则为 null。这对于传输少量数据很有用。
request	Object	请求对象本身(Ajax.Request 或 Ajax.Updater 的实例)。
transport	Object	本机 xmlHttpRequest 对象本身。

示例

以下示例展示了 status 和 responseText 属性的用法 −

<html>
   <head>
      <title>Prototype examples</title>
      <script type = "text/javascript" src = "/javascript/prototype.js"></script>
      
      <script>
         function SubmitRequest() {
            new Ajax.Request('/cgi-bin/ajax.cgi', {
               method: 'get',
               onSuccess: successFunc,
               onFailure:  failureFunc
            });
         }
         function successFunc(response) {
            if (200 == response.status) {
               alert("Call is success");
            }
            var container = $('notice');
            var content = response.responseText;
            container.update(content);
         }
         function failureFunc(response) {
            alert("Call is failed" );
         }
      </script>
   </head>

   <body>
      <p>Click submit button to see how current notice changes.</p>
      <br />
 
      <div id = "notice">Current Notice</div>
      <br />
      <br />
      <input type = "button" value = "Submit" onclick = "SubmitRequest();"/>
   </body>
</html>

这是ajax.cgi的内容。

#!/usr/bin/perl

print "Content-type: text/html

";

print "This content is returned by AJAX cgi 
";
print "Current Time " . localtime;

输出

Ajax.Response 对象的方法

方法	类型	描述
getHeader(name)	字符串或 null	返回请求标头的值(如果存在)。否则返回 null。
getAllHeaders()	String 或 null	返回一个字符串，其中包含所有以换行符分隔的标头。
getResponseHeader(name)	String	如果存在，则返回请求标头的值。否则抛出错误。这只是 xmlHttpRequest 对象的本机方法的包装器。更喜欢它的短版 getHeader。
getAllResponseHeaders()	String	返回一个字符串，其中包含所有以换行符分隔的标头。否则会引发错误。这只是 xmlHttpRequest 对象本机方法的包装器。更喜欢它的短版 getAllHeaders。

示例

以下示例展示了 getAllHeaders() 和 getResponseHeader(name) 方法的用法 −

<html>
   <head>
      <title>Prototype examples</title>
      <script type = "text/javascript" src = "/javascript/prototype.js"></script>
      
      <script>
         function SubmitRequest() {
            new Ajax.Request('/cgi-bin/ajax.cgi', {
               method: 'get',
               onSuccess: successFunc
            });
         }
         function successFunc(response) {
            var content = response.getAllHeaders();
            var container = $(header1);
            container.update(content);
            var content = response.getResponseHeader('Content-Type');
            var container = $(header2);
            container.update(content);
         }
      </script>
   </head>

   <body>
      <p>点击提交按钮，查看结果:</p>
      <br />
 
      <div id = "header1">All Headers</div>
      <div id = "header2">Content Type</div>
      <br />
      <br />
      <input type = "button" value = "Submit" onclick = "SubmitRequest();"/>
   </body>
</html>