Question

我是JS的新手，之前从未尝试过Handlebars。我在教程中尝试了一个非常简单的例子。我已从Handlebars网站下载handlebars-v4.0.5.js并将其包含在我的页面中，如下所示，以及我预编译的模板name-table.js。我努力完成this tutorial我的死神，但我无法做到，因为当我运行以下代码时，我得到了ReferenceError: Handlebars is not defined，这是我无法生活的。我明白，如果我从Handebars＆＃39;自己的网站无论如何都有效。

<html>
    <head>
        <meta charset='UTF-8'>
        <title>Test Page!</title>
        <script type='text/javascript'>
            function init() {
                document.getElementById('button').addEventListener('click', buttonClick, false);
            }
            function buttonClick() {
                var injection = Handlebars.templates['name-table'];
                document.getElementById('button').innerHTML = injection;
                console.log('hello, world.');
            }

            window.addEventListener('load', init, false);
        </script>
    </head>
    <body>
        <button id='button'>Button</button>
        <div id='content'></div>

        <script type='text/javascript' rel='js/handlebars-v4.0.5.js'></script>
        <script type='text/javascript' rel='js/name-table.js'></script>
    </body>
</html>

修改我标记的答案解决了问题。 此代码中出现了另一个错误，我想让任何阅读此内容的人知道此代码中定义的var injection是一个函数，而不是我想到的字符串。如果rel更改为src，则会在给出的答案中使用此代码，如果我们使用document.getElementById('button').innerHTML = injection();（请注意parens）。

Answer 1

您没有加载Handlebars（或您的名称表脚本）。您目前有以下标记：

    <script type='text/javascript' rel='js/handlebars-v4.0.5.js'></script>
    <script type='text/javascript' rel='js/name-table.js'></script>

您应该使用 src 属性而不是脚本标记的 rel 属性。

    <script type='text/javascript' src='js/handlebars-v4.0.5.js'></script>
    <script type='text/javascript' src='js/name-table.js'></script>

Mozilla documentation未将rel属性指定为有效的脚本标记属性。

Answer 2

包括此行：

<script src="https://twitter.github.io/typeahead.js/js/handlebars.js"></script>

您完成了。谢谢。

车把未定义

2 个答案: