Prototype使用学习手册指南之ajax.js

nice囚牢

nice囚牢

2016-02-19 20:05

最近很多朋友喜欢上设计,但是大家却不知道如何去做,别担心有图老师给你解答,史上最全最棒的详细解说让你一看就懂。

  和在我以前使用这个类库的不少开发者一样,一开始,我不得不一头扎进阅读prototype.js的源代码和实验它的功能中。Prototype中的ajax.js提供了一个非常好用的ajax框架,一般应用中简单的调用以下代码就可以了

new Ajax.Request(
  url, {method: “get”,
  onSuccess: showFilter,
  onFailure: function(request){alert(”Server error!”)},
  onException: showError}
);

  这个框架中提供了如下的对象和方法等:

  Ajax对象:只有一个getTransport方法,返回一个XMLHttpRequest对象,另外有一个activeRequestCount属性,反映当前正在处理的ajax数量

  Ajax.Responders对象:继承自Enumerable,管理全局Ajax的请求,具有如下方法:

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

  register(responder):注册一个管理ajax请求的对象

  unregister(responder):撤销一个管理ajax请求的对象

  dispatch(callback, request, transport, json):触发注册的处理对象的方法

  这个对象一般很少使用,系统中已经使用如下的代码注册了一个处理对象

Ajax.Responders.register({
 onCreate: function() {
  Ajax.activeRequestCount++;
 },
 onComplete: function() {
  Ajax.activeRequestCount–;
 }
});

  Ajax.Base类:

  Ajax的基类, 只有一个方法setOptions(options), 默认request参数如下,你可以在新建Ajax.request时指定:

method:'post’,
asynchronous: true,
contentType:'application/x-www-form-urlencoded’,
encoding:'UTF-8′,

  Ajax.Request类:

  ajax主要的类,继承自ajax.base类,客户端使用 new Ajax.Request(url,options) 调用,options是一个对象(关联数组), 在options中可以指定method,asynchronous,contentType,encoding,parameters, postBody,username,password等选项,其中parameters可以是字符传或者关联数组象,

  另外在options中还可以通过requestHeaders指定request heads,其中requestHeaders可以是数组(例如[”Connection”,”Close”,”aheadkey”,”aheadvalue”])或一个关联数组;

  options中最重要的选项就是指定ajax的回调方法,可以定义onComplete, onSuccess, onFailure, onException(执行过程中发生异常调用的方法,主要为onComplete, onSuccess, onFailure等回调方法产生的),甚至可以定义on404,on503这样的回调方法,它们的参数为(transport, json),其中transport为请求的XMLHttpRequest对象, json是evalJSON的结果

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

  如果返回的是一个javascript文件(根据返回的Content-type头判断)将会执行evalResponse方法,另外Ajax.Request对象还有一个evalJSON方法,取得文件的时候就会执行

  这个对象的方法列表如下:

  request(url) : 发送请求,new的时候就已经调用了,所以一般不需要使用

  success(): 判断request是否成功了

  getHeader(name):根据name得到request head

  evalJSON(): 执行getHeader(”X-JSON”),并返回结果

  evalResponse(): 执行返回的responseText并返回

  Ajax.Updater类:

  继承自Ajax.Request,只是比Ajax.Request增加了更新html元素的功能,一般使用方法是new Ajax.Updater(element, url, options), element可以是一个元素,也可以是{success:e1,failure:e2}这种形式,

  默认情况下不会执行返回结果中的javascript,如果你先执行,你可以指定options中的evalScripts为true

  默认情况下是替换指定元素的内容,如果你希望是添加,可以指定options的insertion参数, insertion是一个Insertion.Before、Insertion.Top或Insertion.Bottom、 Insertion.After(将在dom.js中介绍)

  Ajax.PeriodicalUpdater类:

  继承自Ajax.Base,周期性的更新一个html元素的内容,这个类会调用Ajax.Updater对html元素进行周期性的更新,使用方法为new Ajax.PeriodicalUpdater(container, url, options), 参数跟Ajax.Updater差不多,其中options可以设置frequency(默认为2),decay,decay指的是当请求的内容没有变化的时候,frequency需要延长的倍数,默认是1,例如如果decay设为2,frequency设为3而内容一直没有变化,则请求的时间依次会变为 3,6,12,24等

展开更多 50%)
分享

猜你喜欢

Prototype使用学习手册指南之ajax.js

Web开发
Prototype使用学习手册指南之ajax.js

Prototype使用学习手册指南之form.js

Web开发
Prototype使用学习手册指南之form.js

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

prototype使用学习手册指南之Position.js

Web开发
prototype使用学习手册指南之Position.js

Prototype使用学习手册指南之Selector.js

Web开发
Prototype使用学习手册指南之Selector.js

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

prototype使用学习手册指南之event.js

Web开发
prototype使用学习手册指南之event.js

Prototype使用学习手册指南之dom.js

Web开发
Prototype使用学习手册指南之dom.js

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

WebLogic运用DB的Java控件访问数据库

WebLogic运用DB的Java控件访问数据库

XUL 教程 增加HTML元素

XUL 教程 增加HTML元素
下拉加载更多内容 ↓