Javascript SyntaxError：意外的标记'}'

Question

I have the following simple code, however for some reason it trows a Unexpected token "}" error, and I'm not entirely sure why. I have the following code to generate the buttons

var OverlayMessage = ("Do you want to test these settings? <br> <h6>" + protocol + ":" + systemcodeSend + "-" + unitcode + " sending " + state + '</h6> <br> <a id="btnGreen" onclick="checkIfSettingsWork("' + protocol +'", "'+ systemcodeSend +'", "'+ unitcode +'", "'+ state +'");">Yes</a> <a id="btnRed" onclick="toggleVisibility(\'overlayAddDevice\')">No</a>');
        console.log(OverlayMessage);
        overlayMessage(OverlayMessage);

The output of console.log is as followed

<a id="btnGreen" onclick="checkIfSettingsWork("pollin", "31", "14", "on");">Yes</a>

The strange thing is, if I run from the debugger, it works fine without errors. However when being ran trough the onclick event it trows the Unexpected token error.

The function checkIfSettingsWork is not even being ran, I checked this by letting it log to console, and that is returning nothing when being ran by the onclick event however it works when I run the following javascript trough the debugger.

checkIfSettingsWork("pollin", "31", "14", "on");

This is the checkIfSettingsWork function.

function checkIfSettingsWork(protocol, systemcodeSend, unitcode, state) {
    console.log(protocol + systemcodeSend + unitcode + state)

}

Answer 1

This is invalid html:

 <a id="btnGreen" onclick="checkIfSettingsWork("pollin", "31", "14", "on");">Yes</a>

The " characters are ending your onclick attribute early, so the browser ends up interpreting it as just onclick="checkIfSettingsWork(" .

Change it to this for a workaround:

<a id="btnGreen" onclick="checkIfSettingsWork('pollin', '31', '14', 'on')">Yes</a>

Answer 2

有效的synatax将是

<a id="btnGreen" onclick="checkIfSettingsWork('pollin', '31', '14', 'on')">Yes</a>

Answer 3

You made a low-level mistake.

This is invalid like onclick="checkIfSettingsWork("pollin", "31", "14", "on");"

You need fix " to ' .

Another thing is i think when you declaring OverlayMessage , just my suggestion, maybe you need use " and ' characters by uniform way.

Answer 4

You have many contexts going on here and I think they need to be separated. You are trying to create text, HTML, and JavaScript in this one declaration. Also in you mixed single and double quotes. In your concatenation. You could use both but they have to match.

It's not safe to do all these in one line. Especially the onClick function. I don't want to create a template for the HTML, right out for a JavaScript function, then feed the variables into the function.

You also don't need any quotes for your parameters in your function you could just feed in the variables.

CheckIfSettingsWork( protocol, systemcodeSend, unitcode, state)