ajax回调函数参数传递正确方法

 更新时间:2010年12月28日 22:02:25   作者:  
ajax回调函数参数传递正确方法,很多朋友习惯的写错了,这里简单的小结下。
属性方法是可以带参数:
复制代码 代码如下:

function ClassX(name) {
this.name = name;
ClassX.prototype.show = function (param) {
alert(this.name + " " + param);
};
}
var o = new ClassX("name");
o.show("param");//name param


但是,上面是虽然是直接在函数签名中定义了参考,如果不是自己调用o.show('param')时,而是通过其他函数回调传入时,就不一定好使了,因为别人在调用此方法时不一定给你传入此参,比如在使用ajax时

request.onreadystatechange=function(param){...}



request.onreadystatechange=callBack;function callBack(param){...}

时就不好使了,因为此时ajax根本就没有给你传递param参数,正确做法形如:
复制代码 代码如下:

//request.onreadystatechange = orgEval;//错误作法

//request.onreadystatechange = function (request, pOrgName) {//错误作法
// orgEval(request, pOrgName);
//};

//...
request.onreadystatechange = function () {//正确作法
orgEval(request, pOrgName);//在匿名函数内调用回调实现,并直接传入参数,这里用到了JavaScript的闭包性质
};
//...

function orgEval(req, orgName){
//...
}

这样通过在匿名函数内调用回调实现函数,并且直接传入参数即可。

ajax传递参数给onreadystatechange的回调函数

这几天开始学习ajax,其中自己做试验页面时有了传参数给XMLHttpRequest.onreadystatechange的回调函数这个需求。如是baidu了下,发现说到这个的人不少啊。搜来的办法大概是这样:

xmlHttp.onreadystatechange=function(){callback(a,b);};

其中就传递了a和b两个参数。

后来我又自己发现了个方法,方法知道的人肯定很多,不过我在baidu上没搜到,这里就写出来,推广下咯。

复制代码 代码如下:

xmlHttp.a=a;
xmlHttp.b=b;
xmlHttp.onreadystatechange=callback;
.
.
function callback()
{
    if(this.readyState==4)
    {
        a=this.a;
        b=this.b;
    .
    }
}

也就是给xmlHttp对象增加两个属性,在回调函数中直接用this调用那两个属性。

另外说点自己的小经验,xmlHttp最好要写成全局变量,我一开始发现总有些请求没达到目的。后来才发现是把xmlHttp写在了一个函数里面,当那个函数运行完了,xmlHttp生命周期也结束了。这样有些请求在生命周期结束之前就实现了,而有些请求就没了。

相关文章

  • 一篇文章弄清楚Ajax请求的五个步骤

    一篇文章弄清楚Ajax请求的五个步骤

    其实AJAX就是在Javascript中多添加了一个XMLHttpRequest对象,所有的异步交互都是使用XMLHttpServlet对象完成的,下面这篇文章主要给大家介绍了关于Ajax请求的五个步骤,需要的朋友可以参考下
    2022-03-03
  • jquery中AJAX请求 $.post方法的使用

    jquery中AJAX请求 $.post方法的使用

    使用jQuery的$.post方法可以以POST形式向服务器发起AJAX请求.本篇文章主要给大家讲解jquery中AJAX请求 $.post方法的使用,需要的朋友可以参考下
    2015-10-10
  • 图文解析AJAX的原理

    图文解析AJAX的原理

    Ajax的工作原理相当于在用户和服务器之间加了—个中间层(AJAX引擎),使用户操作与服务器响应异步化。网上关于介绍ajax的原理有很多,本文将通过图文的形式给大家更直接明了的介绍,有需要的可以参考学习。
    2016-08-08
  • Ajax实现文件下载

    Ajax实现文件下载

    本文给大家介绍ajax实现文件下载相关知识,涉及到ajax文件下载方面的知识,本文介绍的非常详细,具有参考借鉴价值,感兴趣的朋友一起学习吧
    2016-03-03
  • $.ajax()常用方法详解(推荐)

    $.ajax()常用方法详解(推荐)

    AJAX 是一种与服务器交换数据的技术,可以在补充在整个页面的情况下更新网页的一部分。接下来通过本文给大家介绍ajax一些常用方法,非常不错,具有参考借鉴价值,感兴趣的朋友一起学习吧
    2016-07-07
  • ajax实现简单实时验证功能

    ajax实现简单实时验证功能

    这篇文章主要介绍了ajax实现简单实时验证功能,需要的朋友可以参考下
    2017-12-12
  • Ajax修改数据即时显示篇实现代码

    Ajax修改数据即时显示篇实现代码

    上一篇我们讲了如何使用ajax向数据库添加数据,今天我们要大家学习的课程是:使用ajax修改数据库数据,并在客户网页立即显示新的内容.当然在修改的过程中同样不会有刷新网页的情况发生!
    2010-10-10
  • AJAX 缓存问题的两种解决方法(IE)

    AJAX 缓存问题的两种解决方法(IE)

    ajax 清除缓存的两种方法
    2007-10-10
  • Ajax实现城市二级联动(三)

    Ajax实现城市二级联动(三)

    这篇文章主要为大家详细介绍了Ajax实现城市二级联动的方法,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-02-02
  • AJAX实现瀑布流布局

    AJAX实现瀑布流布局

    这篇文章主要介绍了AJAX实现瀑布流布局的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-10-10

最新评论