views:

7496

answers:

5

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

A: 

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.

Tomas Lycken
-1 jQuery extends the event object to make e.preventDefault(); be cross browser.
Paolo Bergantino
http://docs.jquery.com/Events/jQuery.Event#event.preventDefault.28.29: Prevents the browser from executing the default action. Use the method isDefaultPrevented to know whether this method was ever called (on that event object). Fixed where necessary (IE).
Paolo Bergantino
I did not know that they had updated it to work with IE as well - it didn't last time I checked. However, adding return false; should still solve the problem.
Tomas Lycken
A: 

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...)

Stobor
That depends entirely on what he's returning from serverside. If the result is just a collection of table rows, without the wrapping <table> tag, it will work just fine the way it is.
Tomas Lycken
@Tomas Lycken: I had checked before I responded; he's sending back divs, or full tables.
Stobor
@Tomas Lycken: infact, I had even checked with the script debugger: the content was getting added inside the table tag, but it wasn't getting rendered to screen.
Stobor
+1  A: 

I am having the same problem. Many sites I have found have suggested that IE may be caching your code and suggest to append the code to

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

This should ensure that a IE isn't caching.

See http://zacster.blogspot.com/2008/10/jquery-ie7-load-url-problem.html for more info.

S.Kiers
A: 

If load is with PHP, reset your array values. For example:

$result = ''; // do this
$row = ''; // do this
$data = ''; // IMPORTANT Kills odd behavior CACHE FOR IE

$result = mysql_query("your sql here");
while ($row = mysql_fetch_array($result)){    
$data[] = $row ..... blah blah blah...
Stuart
A: 

Yes. Caching issue. Thanks, S.Kiers

Cat