jQuery's .load() not working in IE - but fine in Firefox, Chrome and Safari

Admin 1
Viewed 87799

I'm hitting my head on the wall against this one ...

I have the following code:

$("#home").click(function(e) {
    $(".tabs").attr("src","tabs-home.gif");
    $(".islice").hide('fast');
    $(".islice").load("home.html");
    $(".islice").show('fast');  
    e.preventDefault();
});

It works perfectly fine in Firefox, Safari and Chrome, but IE only runs attr() and does not do either the hide/show or the load. I tried removing the hide and show and it still does not work.

IE reports no syntax errors, even with DebugBar. What could I be doing wrong?

You can see the live site at http://www.brick-n-mortar.com

internet-explorer jquery
15 Answers

If the HTML that you are loading is broken, jQuery's .load() will not work in IE.. It was the problem for me. After I fixed the HTML , everything worked great in IE also !

user_1712850

I had the same problem with IE9.

All ajax requests die silently by default. By using http://api.jquery.com/ajaxError/ I was able to determine the type of error by logging the exception message: An error with the code c00ce56e.

It turns out that this means the response is not being passed utf-8 encoded, as it should be in response to an ajax request.

Turns out I had an typing error in header('Content-type: text/html; charset=utf-8');

user_6985110

The e.preventDefault() won't make any difference in IE - you'll have to use return false; to stop things from happening:

$("#home").click(function(e) {
    $(".tabs").attr("src","tabs-home.gif");
    $(".islice").hide('fast');
    $(".islice").load("home.html");
    $(".islice").show('fast');  
    e.preventDefault();
    return false;
});

To debug this in detail, take a look at Firebug.

user_380550

You're .load()ing into a <table>?

Hmm... Maybe push the .islice class up a level, into the <td>, or maybe a <div> in between...

(Not that that's necessarily the issue, but it's a possiblity...)

user_434520
Related