JavaScript Uncaught SyntaxError: Unexpected token ILLEGAL
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28396807/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JavaScript Uncaught SyntaxError: Unexpected token ILLEGAL
提问by leo
I tried to run below code but chrome showed Unexpected token ILLEGAL. Can anyone help ?
我试图在代码下方运行，但 chrome 显示Unexpected token ILLEGAL。任何人都可以帮忙吗？
When I click the button, it should add the tag, and when it find images/1h.jpgit does not exist ,it should trigger onerrorevent and run function onc()to add some CSS and load another picture, but it didnt run function onc()and when I access console ,it shows Uncaught SyntaxError: Unexpected token ILLEGAL.
当我点击按钮时，它应该添加标签，当它找到images/1h.jpg它不存在时，它应该触发onerror事件并运行函数 onc()添加一些 CSS 并加载另一张图片，但它没有运行函数 onc()并且当我访问控制台时，它显示Uncaught SyntaxError: Unexpected token ILLEGAL。
<button id='a' onclick="onc();">aaa</button>
<div></div>function onc(){
var path1= 'images/1h.jpg';//Does not exist
var path2= 'images/1s.jpg';//exist
var tmp = "<img src='"+path1+"' onerror='nofind(this,"+path2+");' /> ";
$('div').html(tmp);
}回答by T.J. Crowder
In the rendered JavaScript in the HTML attribute text, the string you have in path2won't be in quotes, it'll look like this:
在 HTML 属性文本中呈现的 JavaScript 中，您所在的字符串path2不会被引号括起来，它看起来像这样：
onerror='nofind(this,images/1s.jpg);'
One solution is to put it in quotes:
一种解决方案是将其放在引号中：
var tmp = "<img src='"+path1+"' onerror='nofind(this,\""+path2+"\");' /> ";
// Change is here -----------------------------------^^---------^^
...which renders like this:
...呈现如下：
onerror='nofind(this,"images/1s.jpg");'
A better solution, though, would be not to use an onXyzattribute at all. There's no reason to. Instead, use modern event handling:
不过，更好的解决方案是根本不使用onXyz属性。没有理由这样做。相反，使用现代事件处理：
function onc(){
var path1= 'images/1h.jpg';//Does not exist
var path2= 'images/1s.jpg';//exist
var img = $("img").on("error", function() {
nofind(this, path2);
}).attr("src", path1);
$('div').html(img);
}
Note that we hook the errorevent beforesetting the srcattribute. This may not be strictly necessary with errordepending on the reason for the error, but it's a good habit to get into and it can matter quite a lot for the related loadevent. (It's a common misconception that you can hook the loadevent after setting src; it works mostof the time, but may not if the browser has the image cached and the cache settings for it allow the browser to reuse it without revalidating it, in which case the browser may fire the loadevent as soon as srcis set and, not seeing any JavaScript handlers, doesn't queue them to run when the JavaScript thread is next free to run handlers. [There is only one main JavaScript UI thread, but browsersare multi-threaded.])
请注意，我们在设置属性之前挂钩了error事件。根据错误的原因，这可能不是绝对必要的，但这是一个很好的习惯，它对相关事件非常重要。（这是一个常见的误解，您可以在设置后挂钩事件；它在大多数情况下都有效，但如果浏览器缓存了图像并且它的缓存设置允许浏览器重用它而无需重新验证它，则可能不会，在这种情况下浏览器可能会尽快触发该事件srcerrorloadloadsrcloadsrc已设置，并且没有看到任何 JavaScript 处理程序，当 JavaScript 线程下一次可以自由运行处理程序时，不会将它们排队运行。[只有一个主要的 JavaScript UI 线程，但浏览器是多线程的。])
