添加 OnError 后出现异常错误答案

【问题标题】：exception error after adding OnError添加 OnError 后出现异常错误
【发布时间】：2012-12-20 16:11:43
【问题描述】：

希望有人能提供帮助。

我有一个 java 脚本，可以在我的 html 页面中创建许多图像。但如果图像丢失（未找到），我想显示默认图像（none.png）。所以使用上面的onerror方法我改变了下面的工作线

来自

aelem.innerHTML += "<img src='/AjaxZfc/ViewClient.aspx?public=only&name=Extensions/row/" + itab + ".png' alt=" + TabNode.text + " />";

到

  aelem.innerHTML += "<img src='/AjaxZfc/ViewClient.aspx?public=only&name=Extensions/row/" + itab + ".png' alt=" + TabNode.text + " onerror="this.onerror=null;this.src='/AjaxZfc/ViewClient.aspx?public=only&name=Extensions/row/none.png';" />";

但我的脚本现在失败并说

第 88 行..（上一行） char 180 （我认为是单引号 ' ）预期“;”

请你帮忙

谢谢

【问题讨论】：

您不应该真正使用onX 属性，至少不应该这样。它不是很可读。

标签： javascript syntax onerror

【解决方案1】：

您应该使用反斜杠转义所有 inner 双引号：

aelem.innerHTML += "<img src=\"/AjaxZfc/ViewClient.aspx?public=only&name=Extensions/row/" + itab + ".png\" alt=\"" + TabNode.text + "\" onerror=\"this.onerror=null;this.src='/AjaxZfc/ViewClient.aspx?public=only&name=Extensions/row/none.png';\" />";

【讨论】：

【解决方案2】：

你必须按如下方式使用它

aelem.innerHTML += "<img src='/AjaxZfc/ViewClient.aspx?public=only&name=Extensions/row/" + itab + ".png' alt=" + TabNode.text + " onerror='this.onerror=null;this.src=\'/AjaxZfc/ViewClient.aspx?public=only&name=Extensions/row/none.png\';' />";

你的写作方式不是一个好的选择。总是喜欢使用函数而不是编写内联函数。

你可以使用以下

aelem.innerHTML += "<img src='/AjaxZfc/ViewClient.aspx?public=only&name=Extensions/row/" + itab + ".png' alt=" + TabNode.text + " onerror='ChangeSource(this)' />";

然后新建一个函数

function ChangeSource(self) {
    self.onerror=null;
    self.src='/AjaxZfc/ViewClient.aspx?public=only&name=Extensions/row/none.png';
}

【讨论】：

【解决方案3】：

在引号内使用引号时必须更加小心。让我们将您的字符串连接拆分为加号：

aelem.innerHTML += "<img src='/AjaxZfc/ViewClient.aspx?public=only&name=Extensions/row/" +
 itab +
 ".png' alt=" +
 TabNode.text +
 " onerror="this.onerror=null;this.src='/AjaxZfc/ViewClient.aspx?public=only&name=Extensions/row/none.png';" />";

问题在最后一行，你想写 onerror="something" 但是你已经有整个图像的 html 代码在双引号中，所以它没有被正确解释（整个 this.onerror... 部分不是被视为一个字符串 - 我认为当您查看 Stackoverflow 如何为您的代码着色时，您可以很容易地看到它）。

在此示例中，您不能轻易将 onerror=".." 更改为 onerror='..'，因为在 onerror 语句中，您还必须在 src 属性中使用单引号。解决此问题的一种方法是使用反斜杠转义一些引号。

【讨论】：