骨干视图不渲染我的模板

我看到this关于在骨干中的简单视图的小文章。但我尝试加载在这样一个模板，我自己.. does not工作:(骨干视图不渲染我的模板

我复制并粘贴代码到我的文件，但没有发生的一切都在这里是我的代码：

<!DOCTYPE html> 
    <head> 
    <meta charset="utf-8"> 

    <script type="text/javascript" src="js/vendor/jquery-1.7.1.js"></script> 
    <script src="js/vendor/underscore.js"></script> 
    <script src="js/vendor/backbone.js"></script> 

    </head> 
    <body> 
    <div id="search_container"></div> 

    <script type="text/javascript"> 
    ;(function(){ 
     SearchView = Backbone.View.extend({ 
     initialize: function(){ 
     _.bindAll(this, 'render'); 
     }, 
     render: function(){ 

     var template = _.template($("#search_template").html(), {}); 
     $(this.el).html(this.template); 
     this.el.html(template); 
     } 
    }); 

    var search_view = new SearchView({ el: $("#search_container") }); 
    })(jQuery); 
    </script> 

    <script type="text/template" id="search_template"> 
    <label>Search</label> 
    <input type="text" id="search_input" /> 
    <input type="button" id="search_button" value="Search" /> 
    </script> 



    </body> 
</html>

包括所有的脚本是最新版本。什么是我的失败？

感谢大家谁愿意帮我:)

yaaan

来源

2011-12-17 yaaaan

这里的工作示例的代码。我把它清理了一下。

<!DOCTYPE html> 
    <head> 
    <meta charset="utf-8"> 
    <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script> 
    <script type='text/javascript' src='http://ajax.cdnjs.com/ajax/libs/underscore.js/1.1.4/underscore-min.js'></script> 
    <script type='text/javascript' src='http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.5.3/backbone-min.js'></script> 
    <script type="text/javascript"> 
     $(function(){ 
     SearchView = Backbone.View.extend({ 
      initialize: function(){ 
      _.bindAll(this, 'render'); 
      }, 
      render: function(){ 
      $(this.el).html($("#search_template").html()); 
      } 
     }); 

     var search_view = new SearchView({ el: $("#search_container") }); 
     search_view.render(); 
     }); 
    </script> 

    <script type="text/template" id="search_template"> 
     <label>Search</label> 
     <input type="text" id="search_input" /> 
     <input type="button" id="search_button" value="Search" /> 
    </script> 
    </head> 
    <body> 
    <div id="search_container"></div> 
    </body> 
</html>

的调用_.template（）被扔一个错误，因为模型没有被传递给它，所以我把这种方法叫出来。

像@nikoshr指出的那样，一旦SearchView被实例化，您就需要调用render（）方法。

从我改变的代码还有一些其他小的调整，你可以看看。

来源

2011-12-17 13:21:16 Paul

骨干视图不渲染我的模板

回答

相关问题