如何在单独的js文件中创建Backbone视图

Question

我正在尝试了解如何模块化 Backbone ToDo tutorial

最初一切都在同一个文件中，但如果我尝试提取到另一个文件：

var TodoView = Backbone.View.extend({
    ...
});

然后这会引发错误：

var view = new TodoView({model: todo});

**Uncaught TypeError: undefined is not a function**

这可能是由于范围问题，但我不知道如何在 $(function() 中创建一个引用，所以我可以在主函数中创建这个新对象。

Answer 1

假设您的第一个代码部分是 TodoView.js，你的第二个代码部分是 app.js.

像这样写你的 html 文件，

<html>
    <head>
        <script type="text/javascript" src="js/TodoView.js"></script>
        <script type="text/javascript" src="js/app.js"></script>
    </head>
    <body>
        // your dom
    </body>
</html>

（编辑，2015-07-27）

抱歉我迟回复了。这个怎么样？

<html>
    <head></head>
    <body>
        <!-- your dom -->

        <script type="text/javascript" src="js/TodoView.js"></script>
        <script type="text/javascript" src="js/app.js"></script>
    </body>
</html>

在许多情况下，大多数 javascript 代码都附加在 </body> 之前，因此 javascript 可以使用您的 dom!

Answer 2

您可以使用 require.js 之类的东西来加载外部文件和管理依赖项。

Answer 3

好的，解决方案是将脚本引用移到正文的末尾，而不是在 head 标签内。

我认为原因是 TodoView.js 正在使用正文中定义的 templates，并且由于 js 文件在正文之前加载，因此模板尚未加载可用。

如何在单独的js文件中创建Backbone视图

How to create Backbone View in a separate js file

javascript

jquery

backbone.js