Question

I have a script to open a model window.. Chrome gives me “Uncaught SyntaxError: Unexpected token }” on a line that doesn’t even have a closing curly brace.

Here is the portion of the script that has the error:

function showm(id1){
  window.onscroll=function(){document.getElementById(id1).style.top=document.body.scrollTop;};
  document.getElementById(id1).style.display="block";
  document.getElementById(id1).style.top=document.body.scrollTop;
}

Does anybody have any ideas on this? Any help is appreciated.

Answer 1

Try running the entire script through jslint. This may help point you at the cause of the error.

Edit Ok, it’s not quite the syntax of the script that’s the problem. At least not in a way that jslint can detect.

Having played with your live code at http://ft2.hostei.com/ft.v1/, it looks like there are syntax errors in the generated code that your script puts into an onclick attribute in the DOM. Most browsers don’t do a very good job of reporting errors in JavaScript run via such things (what is the file and line number of a piece of script in the onclick attribute of a dynamically inserted element?). This is probably why you get a confusing error message in Chrome. The FireFox error message is different, and also doesn’t have a useful line number, although FireBug does show the code which causes the problem.

This snippet of code is taken from your edit function which is in the inline script block of your HTML:

var sub = document.getElementById('submit');
...
sub.setAttribute("onclick", "save(\""+file+"\", document.getElementById('name').value, document.getElementById('text').value");

Note that this sets the onclick attribute of an element to invalid JavaScript code:

<input type="submit" id="submit" onclick="save("data/wasup.htm", document.getElementById('name').value, document.getElementById('text').value">

The JS is:

save("data/wasup.htm", document.getElementById('name').value, document.getElementById('text').value

Note the missing close paren to finish the call to save.

As an aside, inserting onclick attributes is not a very modern or clean way of adding event handlers in JavaScript. Why are you not using the DOM’s addEventListener to simply hook up a function to the element? If you were using something like jQuery, this would be simpler still.