JQuery document ready function not working in IE

Question

I have a function I'm using to replace some text output with a button or sold out label accordingly.

jQuery(document).ready(function() {
jQuery('td.register').each(function () {
    var text = jQuery(this).text();
    var exploded = text.split(',');
    console.log(exploded[0]);
    console.log(exploded[1]);
    if (exploded[0] == 0) {
        jQuery(this).html("<font color='red'>SOLD OUT</font>");
    } else {
        jQuery(this).html("<a class='button' title ='Register for this event' href='" + exploded[1] + "'>Register</a>"); 
    }
})
});

It seems to work fine on most browsers, but the client is complaining in IE9 it's not working. When I test it on my computer, most of the time it works, but sometimes it doesn't, and every time I test it on browsershots.org it doesn't work. It shows up in browsershots.org tests as if the jQuery didn't even run.

It's because you use `console.log()` which is available in IE9 [only when the dev tools are open](http://stackoverflow.com/questions/5472938/does-ie9-support-console-log-and-is-it-a-real-function). Just remove those lines and it should work. — JJJ, Mar 13 '13 at 07:53
And as a side note, you might want to make sure the content looks ok and preferably works even when JavaScript is disabled. — JJJ, Mar 13 '13 at 07:55
I found this by Googling "document ready function doesn't work in internet explorer". But I wonder how I could have discovered this problem myself? How could I have tracked it down? As a side note, I had some issues on an AJAX page and then discovered the `ajaxComplete` function. — Buttle Butkus, Aug 21 '13 at 07:43

score 7 · Accepted Answer · answered Mar 13 '13 at 07:56

7

console is not defined in IE9 modify your code like

jQuery(document).ready(function() {
jQuery('td.register').each(function () {
    var text = jQuery(this).text();
    var exploded = text.split(',');
    if(typeof(console)!='undefined'){
        console.log(exploded[0]);
        console.log(exploded[1]);
    }
    if (exploded[0] == 0) {
        jQuery(this).html("<font color='red'>SOLD OUT</font>");
    } else {
        jQuery(this).html("<a class='button' title ='Register for this event' href='" + exploded[1] + "'>Register</a>"); 
    }
})
});

answered Mar 13 '13 at 07:56

Dakait

2,531
1
25
43

I can't believe that was it. And the reason I couldn't reproduce it is what Juhana said above - it works when dev tools are open. Thank you! – Scott Fister Mar 13 '13 at 08:17
IE does such thing to you `;)`, glad that resolved your problem – Dakait Mar 13 '13 at 09:45
Helped me to understand IE9 doesn't have console. Couldn't figure out why my code wasn't working while all the time it was caused by console ;) Thank you, +1 – Ben Fransen Nov 13 '14 at 18:05

JQuery document ready function not working in IE

1 Answers1