首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >使用jQuery中止JSONP ajax请求

使用jQuery中止JSONP ajax请求
EN

Stack Overflow用户
提问于 2011-06-25 02:58:48
回答 5查看 7.7K关注 0票数 16

我使用JSONP ajax调用从不同的域加载一些内容,如果用户在按钮上引起“鼠标悬停”,就会执行所有这些内容。

我可以将$.ajax()调用返回捕获为xhr对象,并在每次用户引起“鼠标悬停”时使用它中止ajax请求。但是JSONP回调函数仍然会被调用,这会导致错误,我认为这是因为xhr.abort()方法没有阻止回调函数的调用。

我尝试用try{}catch(e){}包围$.ajax()调用,但是在我调用xhr.abort()方法之后,错误仍然存在。

有没有办法处理这个异常?

引发的异常如下所示(根据Firebug):jQuery16102234208755205157_1308941669256不是函数

异常的内部结构是这样的:jQuery16102234208755205157_1308941669256({...我的json数据来自不同的域...})

EN

回答 5

Stack Overflow用户

回答已采纳

发布于 2011-06-25 03:04:36

在XHR1.5中,所有的Ajax API都对原生jQuery对象有一个包装器对象。看一下:

http://api.jquery.com/jQuery.ajax/#jqXHR

 jqxhr.abort(); // should be what you're looking for
票数 -3
EN

Stack Overflow用户

发布于 2012-04-04 03:12:47

基本的答案很简单:你不能真的abort()一个JSONP调用。因此,真正的问题是,如何避免多余的回调调用和所看到的错误?

您不能在回调中使用try...catch,因为它是异步的;您必须从jQuery端捕获它,而且jQuery通常不处理从回调抛出的异常。(我在我的书“”中讨论了这一点。)您要做的是为每个Ajax调用使用一个惟一的标识符,并在调用成功回调时检查该标识符是否与您进行调用时的标识符相同。下面是一个简单的实现:

var requestCount = 0;
$.ajax(url, {
  dataType: 'jsonp',
  requestCount: ++requestCount,
  success: function(response, code) {
    if (requestCount !== this.requestCount) return;
    // if we're still here, this is the latest request...
  }
});

在这里,我利用了这样一个事实,即您传递给$.ajax的任何内容都附加到在回调中用作this的对象上。

当然,如果abort()让jQuery为我们做这件事,那就太好了。

票数 11
EN

Stack Overflow用户

发布于 2016-12-07 01:26:25

不中止请求

只需将$.ajax()返回的jqXHR对象存储在某个位置即可

theJqXHR = $.ajax(....

如果用户取消请求,则保存的对象为空

// user canceled
theJqXHR = null;

最后,当您收到响应(success回调)时,回调会将响应的jqXHR对象与保存的对象进行比较。

function successCallback(data, textStatus, jqXHR )
{
    if( theJqXHR !== jqXHR )
    {
        // user canceled; discard the response
        return;
    }

    // process the response
}

无jQuery错误。

一般来说,即使对于常规的ajax请求,也不要依赖abort()

  1. 在任何情况下,您都不会在服务器上保存资源,因为您发送的请求将被处理,并且没有办法停止它。然后返回响应。
  2. 某些(较旧的)浏览器不能正确处理abort()

只需“缓存”jqXHR对象并自己处理取消场景即可。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/6472509

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档