I've been looking for a solution all day, but I'm still seeing this error.

It's a Expression Engine setup for a client of ours and we want to implement ajax-navigation. For this we are using the default $.load() function and this works perfectly in ie9, FF, Safari, Chrome, Opera... but it doesn't work in ie8 and below.

I've tested the callback function, that one IS being called, the data is send, I can read it in the console when logging it. But for some odd reason the data isn't inserted.

Here is the code:

load_page: function(url, func){
    $('#content').load(url+' #content>div', function(data, textStatus, jqXHR){
        console.log('page loaded!');
    });
}   

There was a whole bunch of extra code in the callback function but I've been cleaning out the whole javascript/css everything. In search of bugs but nothing to be found.

Based on the ments I decided to add the url and a download:

• The site this problem is found in: .php
• A packet of files, with the problem: .zip

Another piece of the puzzle: There is something weird going on in the javascript. Even the google maps api doesn't function properly, that's the first time this happened to me when using the google maps api.

EDIT : Answered

I finally found the answer to this question, thanks to @epascarello. It is in fact the fault of the data I was trying to import. Because IE8 & below don't understand HTML5 they will try to import the elements into the dom, but when alerting the data I saw the following: [object HTMLUnknownElement], [object HTMLUnknownElement], [object HTMLUnknownElement],...

When I changed the markup of the data to use good old div's instead of article-elements, everything worked fine!

I've been looking for a solution all day, but I'm still seeing this error.

It's a Expression Engine setup for a client of ours and we want to implement ajax-navigation. For this we are using the default $.load() function and this works perfectly in ie9, FF, Safari, Chrome, Opera... but it doesn't work in ie8 and below.

I've tested the callback function, that one IS being called, the data is send, I can read it in the console when logging it. But for some odd reason the data isn't inserted.

Here is the code:

load_page: function(url, func){
    $('#content').load(url+' #content>div', function(data, textStatus, jqXHR){
        console.log('page loaded!');
    });
}   

There was a whole bunch of extra code in the callback function but I've been cleaning out the whole javascript/css everything. In search of bugs but nothing to be found.

Based on the ments I decided to add the url and a download:

• The site this problem is found in: http://www.track.be/devo_9836/nl/ee.php
• A packet of files, with the problem: http://stijnd.be/ie8_load.zip

Another piece of the puzzle: There is something weird going on in the javascript. Even the google maps api doesn't function properly, that's the first time this happened to me when using the google maps api.

EDIT : Answered

I finally found the answer to this question, thanks to @epascarello. It is in fact the fault of the data I was trying to import. Because IE8 & below don't understand HTML5 they will try to import the elements into the dom, but when alerting the data I saw the following: [object HTMLUnknownElement], [object HTMLUnknownElement], [object HTMLUnknownElement],...

When I changed the markup of the data to use good old div's instead of article-elements, everything worked fine!

• javascript
• jquery
• ajax
• internet-explorer

• 2 This could be just code that got missed out, but did you close your function? I only see one } – Jere Commented Jan 19, 2012 at 14:41
• 1 What is the data being loaded? – epascarello Commented Jan 19, 2012 at 14:50
• Maybe something wrong in the data being loaded that only breaks in IE8. – Didier Ghys Commented Jan 19, 2012 at 14:57
• In the code above there is a missing bracket. While copying this code I must have cleaned it up too good :p You can see the site here: track.be/devo_9836/nl/ee.php @Jere: Even when i mented out all the code in between, it still wouldn't insert the html – Stijn_d Commented Jan 20, 2012 at 14:28
• possible duplicate: stackoverflow./questions/4968937/… – feeela Commented Dec 19, 2012 at 12:18

5 Answers 5

I had the same problem and I noticed that if the url returns invalid HTML (eg. extra end tag) it can stop it from loading or finding the correct element.

In my example all I had to do was correct the HTML from the URL and then it worked correctly.

ajax requests are cached in IE8, so just a little magic of

$.ajaxSettings.cache = false;

before the using load function

http://zacster.blogspot.in/2008/10/jquery-ie7-load-url-problem.html

http://api.jquery./jQuery.ajax/

cache (default: true, false for dataType 'script' and 'jsonp')
Type: Boolean
If set to false, it will force requested pages not to be cached by the browser. Note: Setting cache to false will only work correctly with HEAD and GET requests. It works by appending "_={timestamp}" to the GET parameters. The parameter is not needed for other types of requests, except in IE8 when a POST is made to a URL that has already been requested by a GET.

The only thing I can see wrong with this code is you are missing a closing bracket

load_page: function(url, func){
     $('#content').load(url+' #content>div', function(data, textStatus, jqXHR){
           console.log('page loaded!');
     } // <-- this one
}); 

$.load() works in IE8. My guess is you have a previous JS error, triggered only in IE8-, which prevents it from functioning properly, or being called altogether.

The problem is some functions are supported in one and not the others. For example one of my personal hates is how innertext is only supported in ie7,8 but not fox or chrome. Here is the patability chart if you are interested http://www.quirksmode/dom/w3c_html.html .

Bottom line, unless you plan on changing the plugin yourself and you've already tried modernizer and that didn't help, you are going ot have to use another method of loading data. My suggestion is to use .html, you can not go wrong with that, or append and hand form the html yourself in the js. Simpler is always the best solution.