点击图片时出错：Unexpected Token }答案

【问题标题】：Error when clicking image: Unexpected Token }点击图片时出错：Unexpected Token }
【发布时间】：2015-09-26 03:51:51
【问题描述】：

我有一个图像，单击它时应该运行一个函数，但由于一个奇怪的原因，我收到错误“Unexpected Token }”。这是我的代码： HTML：

  <img src='images/buildings/house_3.png' onClick='selectbuilding('house');'>

Javascript：

function selectbuilding(whichbuilding)
{
    building = whichbuilding;
    buildingselected = 1;
    if (building == "house") {
        document.getElementById('maparea').innerHTML="<form method='post'><h2>Base</h2><input id='button' type='button' name='button' onclick='myFunction();' value='Close'/><input id='button' type='button' name='button' onclick='checkelement();' value='Upgrade Base'/></form>";
    }
    if (building == "wood") {
        document.getElementById('maparea').innerHTML="<form method='post'><h2>Wood</h2><input id='button' type='button' name='button' onclick='myFunction();' value='Close'/><input id='button' type='button' name='button' onclick='checkelement();' value='Upgrade Wood'/></form>";
    }
    else {
document.getElementById('selectbuilding').innerHTML="<img src='images/buildings/" + building + "_3.png'>";
    }
}

请帮忙！

【问题讨论】：

尝试改变这个 onClick='selectbuilding('house');'到 onClick="selectbuilding('house')"
您不能将单引号放在单引号内而不转义它们或使用双引号。问题中的代码着色非常明显，它没有将其作为字符串提取。
谢谢，但有问题。我正在使用此代码创建该图像： theDiv.innerHTML += "";如果我改变它，我会得到一个语法错误。
@geotsak "你不能在不转义的情况下将单引号放在单引号内......"
"";

标签： javascript html

【解决方案1】：

查看 HTML，尤其是属性值。解析器应该如何知道属性值在第四个' 结束，而不是第二个？不能。

你写的代码相当于

<img onClick='selectbuilding(' />

它在内部创建了类似的东西

function handler(event) {
    selectbuilding(
}

这显然不是有效的 JavaScript。对函数参数或属性值使用双引号。

【讨论】：

谢谢，但有问题。我正在使用此代码创建该图像： theDiv.innerHTML += "";如果我改变它，我会得到一个语法错误。
@geotsak 转义单引号\'。
@geotsak：如果您想在双引号字符串文字中放置文字双引号，则需要对其进行转义："foo(\"bar\")"。
@Spencer：这无济于事。 "foo'bar" 和 "foo\'bar" 产生相同的字符串值。
@SpencerWieczorek：但这是用双引号分隔的字符串文字的一部分：innerHTML += "... 'selectbuilding('house');' ... "; 单引号只是普通字符，它们不需要也不能转义。你可以在这里看到它没有任何区别：jsfiddle.net/arxzbwy6