Question

我对此功能有疑问：

            function setGalleryTemplate() {
                var projectData = JSON.parse(localStorage.getItem(keyName) ),
                    template = Handlebars.compile( $('#gallery-template').html() );

                $('#Gallery').html( template(projectData) );
            };

这是HTML：

    <div id="Gallery">
    <script id="gallery-template" type="text/x-handlebars-template">
        <ul class="field-list">
            {{#each this.project.modules}}
                <li class="field-item">{{this.id}}</li>
            {{/each}}
        </ul>
   </script>
</div>

单击图像时调用它，它应该显示json文件中的一些细节。如果第一次单击图像，这样可以正常工作。如果再次单击它（或另一个图像），我会得到这个“错误：你必须将一个字符串或Handlebars AST传递给Handlebars.compile。你通过了undefined”。

如果。“html”被“.append”取代，那么整个过程也很好。这不是我想要的。我想“替换”内容（.replaceWith也不起作用），不附加新内容。

Answer 1

由于<script>是<div>内容的一部分，因此设置.html()也会从文档中移除<script>，因此无法使用compile下次使用。

您只想template <script>一次，因此它并不依赖于var galleryTemplate; function setGalleryTemplate() { // compile on-demand, but only once if (!galleryTemplate) galleryTemplate = Handlebars.compile( $('#gallery-template').html() ); var projectData = JSON.parse(localStorage.getItem(keyName) ); $('#Gallery').html( galleryTemplate(projectData) ); }的存在。

<div>

或者，调整标记，以便<script>和<script>是兄弟姐妹，而不是父/子，因此<div>＆＃39时<div id="Gallery"></div> <script id="gallery-template" type="text/x-handlebars-template">  </script>保留在文档中; s内容被替换：

{{1}}

把手与jQuery错误

1 个答案: