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 相关文章推荐
css结合js制作下拉菜单示例代码
Feb 27 Javascript
Js使用WScript.Shell对象执行.bat文件和cmd命令
Dec 18 Javascript
Jquery中的$.each获取各种返回类型数据的使用方法
May 03 Javascript
jQuery仿淘宝网产品品牌隐藏与显示效果
Sep 01 Javascript
JavaScript时间操作之年月日星期级联操作
Jan 15 Javascript
JavaScript function函数种类详解
Feb 22 Javascript
javascript 动态脚本添加的简单方法
Oct 11 Javascript
vue.js实现仿原生ios时间选择组件实例代码
Dec 21 Javascript
ionic中列表项增加和删除的实现方法
Jan 22 Javascript
axios进阶实践之利用最优雅的方式写ajax请求
Dec 20 Javascript
200行代码实现blockchain 区块链实例详解
Mar 14 Javascript
解决ant-design-vue中menu菜单无法默认展开的问题
Oct 31 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 文件上传源码分析(RFC1867)
2009/10/30 PHP
ThinkPHP实现多数据库连接的解决方法
2014/07/01 PHP
php单态设计模式(单例模式)实例
2014/11/18 PHP
PHP获取文件相对路径的方法
2015/02/26 PHP
thinkPHP实现将excel导入到数据库中的方法
2016/04/22 PHP
PHP设置images目录不充许http访问的方法
2016/11/01 PHP
类似CSDN图片切换效果脚本
2009/09/17 Javascript
基于jquery的网站幻灯片切换效果焦点图代码
2013/09/15 Javascript
深入理解JavaScript高级之词法作用域和作用域链
2013/12/10 Javascript
JavaScript Math.ceil 方法(对数值向上取整)
2015/01/09 Javascript
Javascript中For In语句用法实例
2015/05/14 Javascript
JQuery动态添加Select的Option元素实现方法
2016/08/29 Javascript
使用AngularJS2中的指令实现按钮的切换效果
2017/03/27 Javascript
JS实现求5的阶乘示例
2019/01/21 Javascript
微信小程序之滑动页面隐藏和显示组件功能的实现代码
2020/06/19 Javascript
如何使用 vue-cli 创建模板项目
2020/11/19 Vue.js
Python入门篇之编程习惯与特点
2014/10/17 Python
使用IronPython把Python脚本集成到.NET程序中的教程
2015/03/31 Python
用Python编写一个每天都在系统下新建一个文件夹的脚本
2015/05/04 Python
python3中int(整型)的使用教程
2017/03/23 Python
利用pandas将numpy数组导出生成excel的实例
2018/06/14 Python
python 获取url中的参数列表实例
2018/12/18 Python
Linux下Pycharm、Anaconda环境配置及使用踩坑
2018/12/19 Python
使用Python做定时任务及时了解互联网动态
2019/05/15 Python
python从入门到精通 windows安装python图文教程
2019/05/18 Python
Python中函数参数匹配模型详解
2019/06/09 Python
浅谈Python中的字符串
2020/06/10 Python
德国宠物用品、宠物食品及水族馆网上商店:ZooRoyal
2017/07/09 全球购物
Hotels.com泰国:酒店预订网站
2019/11/20 全球购物
高校优秀辅导员事迹材料
2014/05/07 职场文书
咖啡厅商业计划书
2014/09/15 职场文书
常务副县长“三严三实”对照检查材料思想汇报
2014/10/05 职场文书
幽灵公主观后感
2015/06/09 职场文书
中学教师教学工作总结
2015/08/13 职场文书
golang 在windows中设置环境变量的操作
2021/04/29 Golang
volatile保证可见性及重排序方法
2022/08/05 Java/Android