Firefox 控制台获取 SyntaxError：非法字符答案

【问题标题】：Firefox console getting SyntaxError: illegal characterFirefox 控制台获取 SyntaxError：非法字符
【发布时间】：2016-06-14 14:22:41
【问题描述】：

我正在尝试让以下代码 http://jsfiddle.net/qlmhuge/t7a1sh4u/ 在 wordpress 4.5.2 中工作。这是来自 Spotify Web API html 小部件的示例。我收到以下错误：

语法错误：# 符号上的非法字符 {{#each albums.items}}

我要运行它的网站在这里：http://dev-markandersonpianist.pantheonsite.io/discography/

这是我收到错误的脚本：

<script id="results-template" type="text/x-handlebars-template">
    {{#each albums.items}}
    <div style="background-image:url({{images.0.url}})" data-album-id="{{id}}" class="cover"><a href="{{external_urls.spotify}}"><div class="spotify-button"><img src="https://developer.spotify.com/wp-content/uploads/2014/06/play_on_spotify-green.png" /></div></a></div>
    {{/each}}
</script>

如您在上面看到的，它在 jsFiddle 中工作。我不明白为什么它在 WordPress 中不起作用。

【问题讨论】：

您确定 handlebars.js 已正确安装到您的页面吗？
dev-markandersonpianist.pantheonsite.io/wp-content/themes/… 我认为您不应该将车把代码包含在jQuery(function(){})中
我试过了，但没有用。我遇到了同样的错误。
当我做一个页面源把手显示加载到页面中。还有什么我可以检查的吗？

标签： javascript jquery wordpress spotify

【解决方案1】：

这是因为{{#each albums.items}} 和{{/each}}。 # 表示您开始评论。 / 表示您开始了 RegExp。 { 表示您开始描述一个对象。

这里，是因为两个{{。您不能将对象用作属性标签，并且属性必须在对象中进行标记。

它看起来像是一个生成代码的模板。确保之前正确生成了内容。浏览器无法理解模板生成代码。

【讨论】：

如何检查之前生成的内容是否正确？您可以在 jfiddle 中看到另一个依赖它的脚本。
好吧，我只是解释了为什么会出现“语法”错误。至于代码的工作，在 JSFiddle 中有一行 templateSource = document.getElementById('results-template').innerHTML 你不希望代码被执行，所以你可以使用“脚本”标签以外的东西并用 CSS 隐藏它。 <code-template id="results-template"></code-template 是 HTML5 有效的。使用 CSS code-template { display:none; } 它将是不可见的