更改 JavaScript 原型上的函数

发布于 2024-10-03 17:50:15 字数 1519 浏览 2 评论 0原文

我想更改 XMLHttpRequest 发送函数,以便在发出请求之前和请求完成之后调用一个函数。这是我到目前为止所得到的:

var oldSend = XMLHttpRequest.prototype.send;
XMLHttpRequest.prototype.send = function() {
    //this never gets called
    oldOnReady = this.onreadystatechange;
    this.onreadystatechange = function() {
        oldOnReady();
        ajaxStopped();
    }

    ajaxStarted();

    // according to http://www.w3.org/TR/XMLHttpRequest/
    // there's only ever 0 or 1 parameters passed into this method
    if(arguments && arguments.length > 0) {
        oldSend(arguments[0]); //gets to here, calls this method, then nothing happens
    } else {
        oldSend();
    }
}

function ajaxStarted() {
    ajaxCount++;
    document.getElementById("buttonClicky").innerHTML = "Count: " + ajaxCount;
}

function ajaxStopped() {
    $("#isRunning")[0].innerHTML = "stopped";
    ajaxCount--;
    document.getElementById("buttonClicky").innerHTML = "Count: " + ajaxCount;
}

但是,我在这里做错了,因为一旦它命中 oldSend() 调用,它就永远不会返回或触发 onreadystatechange 事件。所以我一定是在这里做了一些错误的事情。有什么想法吗?我设置了一个断点,当我调用这个断点时,它得到了很好的命中:

$.ajax({
    type: "GET",
    url: "file.txt",
    success: function(result) {
                    //this never gets called
        document.getElementById("myDiv").innerHTML = result;
    }
});

所以我的新函数被调用了。我想只是不知道如何调用旧函数。关于如何修复此代码以便实际发出 Ajax 请求并调用我的新回调有什么想法吗?

注意:我知道 JQuery 事件本质上是执行此操作的。但我这样做是为了让它能够与任何 Ajax 调用(Mootools、GWT 等)一起工作。我只是碰巧用 Jquery 测试它。

I want to change the XMLHttpRequest send function so that a function is called before the request is made and after the request is complete. Here is what I have so far:

var oldSend = XMLHttpRequest.prototype.send;
XMLHttpRequest.prototype.send = function() {
    //this never gets called
    oldOnReady = this.onreadystatechange;
    this.onreadystatechange = function() {
        oldOnReady();
        ajaxStopped();
    }

    ajaxStarted();

    // according to http://www.w3.org/TR/XMLHttpRequest/
    // there's only ever 0 or 1 parameters passed into this method
    if(arguments && arguments.length > 0) {
        oldSend(arguments[0]); //gets to here, calls this method, then nothing happens
    } else {
        oldSend();
    }
}

function ajaxStarted() {
    ajaxCount++;
    document.getElementById("buttonClicky").innerHTML = "Count: " + ajaxCount;
}

function ajaxStopped() {
    $("#isRunning")[0].innerHTML = "stopped";
    ajaxCount--;
    document.getElementById("buttonClicky").innerHTML = "Count: " + ajaxCount;
}

However, I'm doing something wrong here because once it hits the oldSend() call, it never returns or triggers the onreadystatechange event. So I must be doing somethingclickCount wrong here. Any ideas? I set a breakpoint and it gets hit just fine when I call this:

$.ajax({
    type: "GET",
    url: "file.txt",
    success: function(result) {
                    //this never gets called
        document.getElementById("myDiv").innerHTML = result;
    }
});

So my new function is getting called. I guess just don't know how to call the old function. Any ideas on how to fix this code so that the Ajax Request is actually made and my new callback gets called?

Note: I'm aware of the JQuery events that essentially do this. But I'm doing this so I can get it to work with any Ajax call (Mootools, GWT, etc). I am just happening to test it with Jquery.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

若水微香 2024-10-10 17:50:15

您需要在 this 上下文中调用old 函数。

例如:oldSend.call(this)

You need to call old functions in the context of this.

E.g.: oldSend.call(this)

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文