JavaScript Gotcha in IE7 - Christopher Bennage - Devlicio.us

Christopher Bennage

Home
Contact

The Lounge

Wicked Cool Jobs

Syndication

Archives

Christopher Bennage » JavaScript Gotcha in IE7

JavaScript Gotcha in IE7

I thought for a while that I was done with Web development. I mean the HTML, CSS, JavaScript stack specifically. WPF and Silverlight have just been so much more fun.

Well, despite that sentiment my weekends have been full for the last couple of months with HTML, CSS, and JavaScript work for Silver Arcade. Surprisingly, I have found it refreshing.

In fact, it’s even influenced my WPF development, but that’s another post.

Silver Arcade passes around a lot of data using JSON. I kept having problems with IE7 and spent too much time scratching my head.

Take a look at this little bit of jQuery that wires up the featured games rotator on the home page.

jQuery(function($) {
    $('#rotator-content').cycle({
        fx: 'scrollLeft',
        easing: 'easeOutQuad', 
        speed: 1000,
        timeout: 6000,
        next: '#next-feature',
        prev: '#prev-feature' ,
        pause:1,
    });
});

This code executes correctly in IE 8, Firefox 3, Safari 4, and Chrome. It breaks in IE 7. (It also works in Opera, but there are other problems there.)

The problem is the comma on the last line. IE 7 expects something more because of the comma. Specifically, the error is:

“Expected identifier, string or number”

Posted 05-03-2009 6:10 PM by Christopher Bennage

Filed under: javascript, json, browser bugs

[Advertisement]

Comments

Nicholas Piasecki wrote re: JavaScript Gotcha in IE7

on 05-03-2009 8:58 PM

Yep, hit that one before. Can be a real head-scratcher, especially since IE7 usually reports a completely insane line number. Fun times!

Nat wrote re: JavaScript Gotcha in IE7

on 05-04-2009 1:55 AM

I thought in ECMAScript,

Syntax

ObjectLiteral :

{ }

{ PropertyNameAndValueList }

PropertyNameAndValueList :

PropertyName : AssignmentExpression

PropertyNameAndValueList , PropertyName : AssignmentExpression

PropertyName :

Identifier

StringLiteral

NumericLiteral

So object initialization should end with , before }

Garren wrote re: JavaScript Gotcha in IE7

on 05-09-2009 2:30 PM

One word: JSLint.

I find it catches all sorts of little issues that I would normally have overlooked. Simple things like missing semi-colons, ambiguous parameters ( i.e. parseInt() and numbers with leading zeros). It would have caught the issue above and saved you some time.

The problem as I see it is that FF, IE8, Opera, and friends are too lax and *should* be complaining about the code you've posted.

Christopher Bennage wrote re: JavaScript Gotcha in IE7

on 05-11-2009 9:59 AM

@Garren JSLint looks very cool.

@Nat I'm not certain how to interpret the spec. How is the optionality of the comma indicated?

One reason why I expected the code to work, is because I can do this in C#:

var test = new {one = 1,};

zihotki wrote re: JavaScript Gotcha in IE7

on 05-24-2009 8:58 AM

It's very easy to make a typo and add a comma on the last line (for example when removing some lines). And this is why I prefer to use the following syntax:

$('#rotator-content').cycle({

fx: 'scrollLeft'

,easing: 'easeOutQuad'

,speed: 1000

,timeout: 6000

,next: '#next-feature'

,prev: '#prev-feature'

,pause:1

});

Using this style it's more harder to make such mistake/typo.

Sponsors

The Lounge

Wicked Cool Jobs

Syndication

Recent Posts

Tags

Archives

Comments