Prototype使用指南之ajax


Posted in Javascript onJanuary 10, 2007

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的请求,具有如下方法
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的结果

如果返回的是一个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等

start(): 开始更新, 初始化的时候会自动调用
stop(): 停止更新

Javascript 相关文章推荐
jQuery总体架构的理解分析
Mar 07 Javascript
jquery取消选择select下拉框示例代码
Feb 22 Javascript
js实现上传图片预览的方法
Feb 09 Javascript
JavaScript中split() 使用方法汇总
Apr 17 Javascript
HTML+CSS+JS实现完美兼容各大浏览器的TABLE固定列
Apr 26 Javascript
纯javascript实现四方向文本无缝滚动效果
Jun 16 Javascript
jQuery结合CSS制作动态的下拉菜单
Oct 27 Javascript
Bootstrap table分页问题汇总
May 30 Javascript
Bootstrap导航简单实现代码
Mar 06 Javascript
js学习总结之dom2级事件基础知识详解
Jul 27 Javascript
vue中过滤器filter的讲解
Jan 21 Javascript
基于JS实现数字动态变化显示效果附源码
Jul 18 Javascript
Prototype使用指南之range.js
Jan 10 #Javascript
Prototype使用指南之hash.js
Jan 10 #Javascript
Prototype使用指南之array.js
Jan 10 #Javascript
Prototype使用指南之enumerable.js
Jan 10 #Javascript
Prototype使用指南之base.js
Jan 10 #Javascript
Prototype使用指南之string.js
Jan 10 #Javascript
Prototype最新版(1.5 rc2)使用指南(1)
Jan 10 #Javascript
You might like
处理php自动反斜杠的函数代码
2010/01/05 PHP
discuz authcode 经典php加密解密函数解析
2020/07/12 PHP
PHP读取mssql json数据中文乱码的解决办法
2016/04/11 PHP
基于yaf框架和uploadify插件,做的一个导入excel文件,查看并保存数据的功能
2017/01/24 PHP
自制PHP框架之模型与数据库
2017/05/07 PHP
YII分模块加载路由的实现方法
2018/10/01 PHP
Display SQL Server Version Information
2007/06/21 Javascript
javascript Array对象基础知识小结
2010/11/16 Javascript
JQuery之拖拽插件实现代码
2011/04/14 Javascript
基于IE下ul li 互相嵌套时的bug,排查,解决过程以及心得介绍
2013/05/07 Javascript
使用firebug进行调试javascript的示例
2013/12/16 Javascript
JavaScript中的return语句简单介绍
2015/12/07 Javascript
JavaScript实现的微信二维码图片生成器的示例
2016/10/26 Javascript
AngularJS中的缓存使用
2017/01/11 Javascript
jQuery EasyUI ProgressBar进度条组件
2017/02/28 Javascript
详解angularjs获取元素以及angular.element()用法
2017/07/25 Javascript
Vue的土著指令和自定义指令实例详解
2018/02/04 Javascript
在vue项目中引用Iview的方法
2018/09/14 Javascript
JS重学系列之聊聊new操作符
2019/03/04 Javascript
跟老齐学Python之编写类之二方法
2014/10/11 Python
python实现清屏的方法
2015/04/30 Python
python 安装virtualenv和virtualenvwrapper的方法
2017/01/13 Python
使用python的pexpect模块,实现远程免密登录的示例
2019/02/14 Python
20行Python代码实现视频字符化功能
2020/04/13 Python
用CSS3写的模仿iPhone中的返回按钮
2015/04/04 HTML / CSS
.NET里面什么时候需要调用垃圾回收
2015/06/01 面试题
餐饮主管岗位职责
2013/12/10 职场文书
总经理秘书工作职责
2013/12/26 职场文书
安全生产管理合理化建议书
2014/03/12 职场文书
2014年五四青年节活动方案
2014/03/29 职场文书
新书发布会策划方案
2014/06/09 职场文书
股权转让协议书
2014/12/07 职场文书
世界环境日活动总结
2015/02/11 职场文书
篮球拉拉队口号
2015/12/25 职场文书
党员电教片《信仰》心得体会
2016/01/15 职场文书
个人房屋租赁合同(标准范本)
2019/09/16 职场文书