1

I just get a blank screen. What am I doing wrong?

index.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="HandheldFriendly" content="true">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="underscore/underscore-min.js"></script>
    <script src="backbone/backbone-min.js"></script>
    <script type="text/template" id="view-navigation-bar-template">
        <ul>
            <li><input type="button" value="Day" /></li>
            <li ><input type="button" value="Week" /></li>
            <li><input type="button" value="Month" /></li>
        </ul>
    </script>
    <script src="common.js"></script>
</head>

<body>
    <div id="view-navigation-bar" class="button-list">
        <!-- Insert view-navigation-bar_template here -->
    </div>
</body>
</html>

common.js

ViewNavigationBarView = Backbone.View.extend({
    initialize: function() {
        this.render();
    },
    render: function() {
        var template = _.template( $("#view-navigation-bar-template").html(), {} );
        this.$el.html( template );

        return this;
    }
});

viewNavigationBarView = new ViewNavigationBarView({ el: $("#view-navigation-bar") });
4

1 回答 1

3

OP 问题的答案取决于没有 document.ready 侦听器。主干视图本身并不等待 DOM 可用。因此立即插入并没有做任何事情。

快速修复：将其包裹起来$(document).ready(function() { });

于 2013-05-24T16:29:26.947 回答