骨干视图不显示

我正在使用下划线作为模板。我无法获得任何意见加载到我的网页上。我试图导航到页面，也加载初始化函数中的视图，也没有工作。骨干视图不显示

这段代码大部分来自示例。我没有触及util功能，只是稍微修改了主要功能并添加了我自己的login.html

当我导航到URL时，出现“此网页尚未找到”初始化函数没有任何变化。

任何帮助，将不胜感激

main.js

Backbone.View.prototype.close = function() { 
    console.log('Closing view ' + this); 
    if (this.beforeClose) { 
     this.beforeClose(); 
    } 
    this.remove(); 
    this.unbind(); 
}; 
var AppRouter = Backbone.Router.extend({ 
    initialize: function() { 
     // $('#contents').html(new LoginView().render().el); 
    }, 
    routes: { 
     ""   : "list", 
     "login"  : "login" 
    }, 
    list: function() { 

    }, 
    showView: function(selector, view) { 
     if (this.currentView) 
      this.currentView.close(); 
     $(selector).html(view.render().el); 
     this.currentView = view; 
     return view; 
    }, 
    login: function(){ 
     app.showView('#contents', new LoginView()); 
    } 
}); 
tpl.loadTemplates(['login'], function() { 
    app = new AppRouter(); 
    Backbone.history.start(); 
});

util.js中

tpl = { 

    // Hash of preloaded templates for the app 
    templates: {}, 

    // Recursively pre-load all the templates for the app. 
    // This implementation should be changed in a production environment. All the template files should be 
    // concatenated in a single file. 
    loadTemplates: function(names, callback) { 

     var that = this; 

     var loadTemplate = function(index) { 
      var name = names[index]; 
      console.log('Loading template: ' + name); 
      $.get('tpl/' + name + '.html', function(data) { 
       that.templates[name] = data; 
       index++; 
       if (index < names.length) { 
        loadTemplate(index); 
       } else { 
        callback(); 
       } 
      }); 
     } 

     loadTemplate(0); 
    }, 

    // Get template by name from hash of preloaded templates 
    get: function(name) { 
     return this.templates[name]; 
    } 

};

login.js

window.LoginView = Backbone.View.extend({ 

    initialize: function() { 
     this.template = _.template(tpl.get('login')); 
    }, 

    render: function(eventName) { 
     $(this.el).html(this.template()); 
     return this; 
    }, 


});

的login.html

<div class="row"> 
       <div class="col-lg-12"> 
        <h1 class="page-header">Login</h1> 
       </div> 
       <!-- /.col-lg-12 --> 
      </div> 


       <div class="container"> 
    <div class="row"> 
     <div class="col-md-4 col-md-offset-4"> 
      <div class="panel panel-default"> 
       <div class="panel-heading"> 
        <h3 class="panel-title">Please sign in</h3> 
       </div> 
       <div class="panel-body"> 
        <form accept-charset="UTF-8" role="form"> 
        <fieldset> 
         <div class="form-group"> 
          <input class="form-control" placeholder="E-mail" name="email" type="text"> 
         </div> 
         <div class="form-group"> 
          <input class="form-control" placeholder="Password" name="password" type="password" value=""> 
         </div> 
         <div class="checkbox"> 
          <label> 
           <input name="remember" type="checkbox" value="Remember Me"> Remember Me 
          </label> 
         </div> 
         <input class="btn btn-lg btn-success btn-block" type="submit" value="Login"> 
        </fieldset> 
        </form> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>

index.html的片断和js进口

<div id="page-wrapper"> 
      <div id="contents"> 

      </div> 


     </div> 
<script src="js/utils.js"></script> 
<script src="js/views/header.js"></script> 
<script src="js/views/login.js"></script> 
<script src="js/main.js"></script>

编辑

这里是我的文件夹strucutre：

enter image description here

在开发工具，我有这样的错误：

Failed to load resource: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. file:///C:/Users/Bawn92/Desktop/FYP/Website/WebContent/tpl/login.html

下面是该网站的图像，登录应在middel截面，其内容区的负载。

enter image description here