jQuery 1.5 adds better support for JSONP requests. As you might know, JSONP is a way to avoid the same-origin policy and do cross-domain requests by adding a method call around the JSON data.

Because browsers don’t return data from requests that fail, error handling is tricky compared to normal AJAX requests. There is a workaround by using a timer, which is the way the popular jquery.jsonp plugin solves it.

jQuery 1.5 adds this workaround, so you don’t need this plugin. All other features of the plugin, such as custom callback naming, are possible in jQuery now as well.

Here’s an example:

var req = $.ajax({
    url : url,
    dataType : "jsonp",
    timeout : 10000
});

req.success(function() {
    console.log('Yes! Success!');
});

req.error(function() {
    console.log('Oh noes!');
});

The timeout parameter is essential, because this indicates when a request should be considered ‘failed’. Because of this extra parameter you need to use $.ajax instead of $.getJSON.

The req variable contains the jqXHR object, which can be used to attach multiple callbacks and error handlers.

Add a comment

11 comments

• Anonymous 2011-03-01 on 14:27

  Great article. I was struggling with it since morning, your blog fixed the issue :)

• Anonymous 2011-04-18 on 07:23

  Hey,

  I tried out your example using my serverURL. the following were the observations –

  1. the json response was visible in the net panel of the firebug plugin

  2. but in the console i was shown the following error message – “req is undefined” while accessing the req.success function

  Do I need to make any configuration on the server side for making this jsonp call?

• Thank you! 2011-06-14 on 09:19

  Your article really helped me!

  Thank you :)

• Anonymous 2011-06-30 on 05:47

  Thank you so much. I was trying to get this working for a while. Adding the ‘timeout’ parameter helped!!

• Winton De Shong 2011-07-29 on 03:16

  Ditto. Adding the ‘timeout’ parameter helped me as well. Looked all over for a solution to catch timeout/404 with JSONP. Thanks!

• Prabhakar 2011-12-29 on 21:10

  The code that is mentioned above is not able to catch “error 500 internal server error”.

• Anonymous 2012-03-27 on 01:30

  Nice

• JSONP Ajax error handling | nelsonslog 2012-07-13 on 15:16

  […] Timeouts. Since version 1.5, jQuery will throw a timeout after N seconds if the JSONP call did not succeed. This gives you limited error notification, […]

• jQuery ajax ignores a timeout and doesn't glow a blunder event - Adrian 2014-09-07 on 13:12

  […] did a small blogpost on this theme as […]

• jQuery ajax (jsonp) ignores a timeout and doesn’t fire the error event | ASK AND ANSWER 2016-01-10 on 13:55

  […] did a little blogpost on this subject as […]

• jQuery ajax（jsonp）会忽略超时并且不会触发错误事件|jquery问答 2020-11-19 on 17:37

  […] 我也对此主题做了一个小博文。 […]