Missing} after the property list

Question

I am trying to implement a content slider using jQuery on one of my sites; however, I keep getting this error:

missing } after property list 

Here is my code:

 <script type='text/javascript'> featuredcontentslider.init({ id: 'slider1', contentsource: ['inline', ''], toc: '#increment', nextprev: ['prev', 'next'], revealtype: 'click', enablefade: [true, 0.1], autorotate: [true, 3000] }); </script> 

When I click on the view source in Firefox, I find that the last curly brace is missing, but the code is fine in the file, and using the firebug debug console, I got this error:

 missing } after property list 

I tried many things, looked for missing commas, deleted most lines, but could not find the source of the problem.

EDIT: Firebug points to this line:

 }); 

as an error with an error.

I just checked the script in IE8, Chrome and firefox, and in all three browsers I got code like this:

 <script type='text/javascript'> featuredcontentslider.init({ id: 'slider1', contentsource: ['inline', ''], toc: '#increment', nextprev: ['prev', 'next'], revealtype: 'click', enablefade: [true, 0.1], autorotate: [true, 3000] ); <---- notice the missing bracket </script> 

I also tried to write one line only like this:

 featuredcontentslider.init({ id: 'slider1' }); 

and yet ended up with the same error. The script works fine on the local host, but the script runs on the website itself.

I am wondering if there is a chance that other js code on the page might affect the behavior of this?

Answer 1

Hmmm ... it smells like a website cache error.

Perhaps it was absent at that time } , and even if you fixed it, your website is still serving the old file.

You tried:

• clearing cache in your browser? (to make sure it is a browser)
• using curl or wget to view the raw javascript file (to see if there is an outdated cache server)

Answer 2

This usually happens when the property list is accidentally closed with a ";" Take a look at the following example (which causes the same error):

 $('#test').dialog({ autoOpen: true, resizable: true, draggable: true, width:530, modal: true, closeOnEscape: true, show: { effect: 'blind', duration: 1000 }, hide: { effect: 'fold', duration: 1000 }); }); 

The); after

 hide: { ... }); 

should be deleted.

Answer 3

Ok, I solved the problem by adding an extra curly brace, but I'm not sure why this solved the problem. My last script is as follows:

 <script type='text/javascript'> featuredcontentslider.init({ id: 'slider1', contentsource: ['inline', ''], toc: '#increment', nextprev: ['prev', 'next'], revealtype: 'click', enablefade: [true, 0.1], autorotate: [true, 3000] } <--- notice the extra bracket }); </script> 

and it is compatible with multiple browsers :)