jQuery的阿贾克斯，覆盖onreadystatechange的处理程序 [英] jQuery Ajax, overwrite onreadystatechange handler

问题描述

我最近鬼混了一些Ajax轮询技术。但是，好像我不能覆盖从在Firefox XMLHtt prequest 对象（的onreadystatechange 处理程序3.6.7）。

I'm recently fooling around with some ajax polling techniques. However, it seems like I can't overwrite the onreadystatechange handler from a XMLHttpRequest object in FireFox (3.6.7).

在跟踪为什么FF试图访问时抛出一个异常问题的onreadystatechange ，我意识到这取决于是否发送（）方法被调用或没有。

On tracking the problem why FF throws an exception when trying to access onreadystatechange, I realized it depends whether the send() method was called or not.

在换句话说，这里有一个例子（纯JS，无jQuery的到目前为止），该作品：

In other words, here is an example (plain js, no jQuery so far), that works:

（这是相当简单只是为了演示）

(This is fairly simplified just for a demonstration)

var myxhr = new XMLHttpRequest();
myxhr.open("GET", "/my/index.php");
myxhr.onreadystatechange = function(){
    console.log('ready state changed');
};
console.log("onreadystatechange function: ", myxhr.onreadystatechange);
myxhr.send(null);

这工作，更好地说，这是可能的访问 myxhr.onreadystatechange 在这里。如果我切换的最后两行code，FF抛出一个异常，基本上是告诉我，我不能访问该对象。

This works, better said it's possible to access myxhr.onreadystatechange here. If I switch the last two lines of code, FF throws an exception, basically telling me that I'm not allowed to access this object.

myxhr.send(null);
console.log("onreadystatechange function: ", myxhr.onreadystatechange);

失败。

那么，是我的实际问题？

So where is my actual problem?

嗯，我想使用jQuery的 $。阿贾克斯（）。但是，如果我试图覆盖的onreadystatechange 从 $返回一个 XHR 对象的方法阿贾克斯（），我收到相同的FireFox例外。

Well, I want to use jQuery's $.ajax(). But if I try to overwrite the onreadystatechange method of a XHR object that was returned from $.ajax(), I receive the same FireFox exception.

好吧，我已经找到了为什么出现这种情况，所以我想到了，哎怎么样 $的 beforeSend 属性。阿贾克斯（）？所以，我基本上尝试这样做：

Ok I already found out why this happens, so I thought about, hey what about the beforeSend property of $.ajax() ? So I basically tried this:

var myxhr = $.ajax({
   url:        "/my/index.php",
   type:       "GET",
   dataType:   "text",
   data:        {
       foo:    "1"
   },
   beforeSend: function(xhr){
       var readystatehook = xhr.onreadystatechange;

       xhr.onreadystatechange = function(){
           readystatehook.apply(this, []);
           console.log('fired');
       };
   },
   success:    function(data){
       console.log(data);
   },
   error:      function(xhr, textStatus, error){
       console.log(xhr.statusText, textStatus, error);
   }
});

你猜怎么着，火狐会抛出异常。所以，你现在要做什么？您进入Digg的jQuery的来源，像我一样。但是，这带来了比答案更多的实际问题。它看起来像 beforeSend（）真的叫前 xhr.send（）执行。所以，我不知道为什么在地球上的FireFox不允许覆盖处理，在这一点上。

Guess what, FireFox throws an exception. So what do you do now? You digg into the jQuery source, like I did. But that brought more questions than answers actually. It looks like beforeSend() is really called before xhr.send() is executed. So I'm wondering why on earth FireFox does not allow to overwrite the handler at this point.

结论？

这是不可能创建一个自定义readystatechange处理程序与jQuery / Firefox的？

It's impossible to create a custom readystatechange handler with jQuery/Firefox ?

推荐答案

我跟马兹同意在这里，你仍然可以受益形成查询处理和创建的对象，也没必要补丁的jQuery这个

I agree with Maz here, you can still benefit form the query handling and creating of the object, and also no need to patch jquery for this

不过，如果你不介意修补jQuery的你可以添加这些行

however, if you dont mind patching jquery you could add these lines

        // The readystate 2
        } else if ( !requestDone && xhr && xhr.readyState === 2 && isTimeout !== 'timeout' && s.state2) {
            s.state2.call( s.context, data, status, xhr );
        // The readystate 3
        } else if ( !requestDone && xhr && xhr.readyState === 3 && isTimeout !== 'timeout' && s.state3) {
            s.state3.call( s.context, data, status, xhr );

这行之前：（jQuery的v 1.4.4），或者只是搜索的readyState === 4源

before this line: (jQuery v 1.4.4) or just search for the readyState === 4 in the source

        // The transfer is complete and the data is available, or the request timed out
        } else if ( !requestDone && xhr && (xhr.readyState === 4 || isTimeout === "timeout") ) {

现在你可以用$就再次把处理了的状态2和状态3，像这样：

now you can use the $.ajax again and put a handler up for state2 and state3 like so:

$.ajax({
    url: 'http://www.stackoverflow.com',
    cache: false,
    success:function(){console.log('success');},
    error: function (){console.log('error');},
    complete: function (){console.log('complete');},
    state2: function (context,data,status,xhr) {console.log('state2');},
    state3: function (context,data,status,xhr) {console.log('state3');}
});

它并不完全表现得像其他处理程序，例如returngin假的不会做的事 但你仍然可以处理XHR对象并中止这样

it doesnt exactly behave like the other handlers, eg returngin false wont do a thing but you can still handle the xhr object and abort that way

生病看看我能不能提交此被包含在源在以后的这一天，谁知道他们可能会接受它。

ill see if i can submit this to be included in the source later this day, who knows they might accept it

这篇关于jQuery的阿贾克斯，覆盖onreadystatechange的处理程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！