prototype.js的Ajax对象

2016-02-19 12:01 7 1 收藏

今天图老师小编给大家精心推荐个prototype.js的Ajax对象教程,一起来看看过程究竟如何进行吧!喜欢还请点个赞哦~

【 tulaoshi.com - Web开发 】

我想prototype.js里的ajax对象肯定吸引了不少人,大量封装好的ajax逻辑的类,对于我们这些初学者使用ajax有很大的帮助。
以下用一个我的具体使用例子来解释:效果看这里
1. Ajax.Request
你可以这样创建它
代码如下:

var url = 'http://yoursever/your/your';
var pars = 'id=xxx';
var myAjax = new Ajax.Request(
                    url,
                    {method: 'get', parameters: pars, onComplete: yourfunction}
                    );

parameters表示你要传递的参数,比如id=xxx这些。
XMLHttpRequest在HTTP请求期间的阶段分为:Loading, Loaded, Interactive, Complete。
Ajax.Request对象在任何一个阶段都可以调用你自定义的方法,形式如onxxxxxxx:yourfunction,比如我们上面提到的onComplete,是最常用的。
例子中实际使用的代码
代码如下:

function sends(id)
{
    c = $('content');
    o = $('old-content');
    c.innerHTML = "div id='loading'载入中.../div";
    o.innerHTML = c.innerHTML;
    c.style.display = 'none';
    o.style.display = 'block';
    var myAjax = new Ajax.Request('content_'+ id + '.html', {method: 'get', onComplete:updates});
}
function updates(response)
{
    new Effect.Fade($('old-content'));
    new Effect.Appear($('content'));
    $('content').innerHTML = response.responseText;
}

来源:http://www.tulaoshi.com/n/20160219/1599509.html

延伸阅读
标签: Web开发
AJAX之旅(1):由prototype_1.3.1进入javascript殿堂-类的初探  还是决定冠上ajax的头衔,毕竟很多人会用这个关键词搜索。虽然我认为这只是个炒作的概念,不过不得不承认ajax叫起来要方便多了。所以ajax的意思我就不详细解释了。 写这个教程的起因很简单:经过一段时间的ajax学习,有一些体会,并且越发认识到ajax技术的强大,所以决定...
标签: Web开发
该版本在性能上有着不少的提升,同时引入一个新的元素元数据的存储系统、新的鼠标事件,兼容最新版的浏览器。同时这也是第一个基于 Sprockets 的发行版,Sprockets 是  Prototype 一个 JavaScript 的打包工具。同时文档也做了改进。 值得关注的特性有: 1. 兼容最新浏览器,包括 Chrome 和 IE 8 2. 元数据存储系统,详情请看这里。 3...
标签: Web开发
From: JavaEye.com prototype提供了一套JavaScript面向对象基础设施,我们可以使用它来进行面向对象编程,定义对象类型方式如下:  var Person = Class.create(); Person.prototype = {  initialize : function(name, age) {  this.name = na...
标签: Web开发
Objects are useful to organize information. 对于组织信息来讲对象是非常有用的  JavaScript Objects JS对象 Earlier in this tutorial we have seen that JavaScript has several built-in objects, like String, Date...
标签: Web开发
Prototype中的ajax.js提供了一个非常好用的ajax框架,一般应用中简单的调用以下代码就可以了 new Ajax.Request(     url, {method: “get”,     onSuccess: showFilter,     onFailure: function(request){alert(”Server error!”)},     onException: showErr...

经验教程

978

收藏

32
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部