Uncaught SyntaxError: Unexpected token }

Question

I have a piece of jQuery code which appends an input button to the body and then assigns an onclick function to it. The function that is meant to be called has been defined elsewhere and takes two arguments which are variables that have been defined just before.

This is the code I'm currently using:

$("body").append("<input type='submit' value='foo' onclick='foo(\'" + argument1 + "\',\'" + argument2 + "\'/>");

However, when I try to click on the button, I get an error (in Chrome) saying: Uncaught SyntaxError: Unexpected token }.

Can anyone help me?

SLaks · Accepted Answer · 2010-08-29 20:53:39Z

You should assign the click handler using jQuery:

var input = $('<input type="submit" value="foo" />') .click(function() { foo(argument1, argument2); }) .appendTo(document.body);

Note that this will capture the argument variables by reference.

+1. Trying to pass stringed variables into a JavaScript snippet in an event handler attribute is madness

Mike Robinson · Accepted Answer · 2010-08-29 20:53:26Z

3

You haven't closed the foo() function in the onclick

answered Aug 29, 2010 at 20:53

Mike Robinson

25.2k8 gold badges63 silver badges83 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 11:59:11Z

Suppose argument1 == '1' and argument2 == '2', your .append will give

<input type='submit' value='foo' onclick='foo('1','1'/>

which is obviously not valid HTML. To fix it you should use

.append("<input ... onclick='foo(\"" + argument1 + "\",\"" + argument2 + "\")'/>")

But this is not the right way to use jQuery. See @SLaks's answer for better code.

Collectives™ on Stack Overflow

Uncaught SyntaxError: Unexpected token }

3 Answers 3

1 Comment

Comments

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

1 Comment

Related