javascript - 下划线模板选择器

Question

我使用下划线模板来呈现我的页面。当我使用时，问题就开始了：

$(function(){
   console.log($('.input-placeholder'));
});

我有时可以访问它们，有时它只是不起作用，因为页面在文档加载后呈现。

所以我用

$('#application').html(_.template('<div class="input-placeholder"></div>', {}));

它有时会打印到控制台它找到了输入占位符，但并非一直如此。如何确保在加载模板后触发 $(function(){})。

谢谢

Answer 1

http://lostechies.com/derickbailey/2011/11/09/backbone-js-object-literals-views-events-jquery-and-el/

在 render 方法中读取模板：

Backbone.View.extend({
  render: function(){
    var html = _.template($("#my-template"));
    this.$el.html(html);
  }
});

然后等到 DOMReady 事件触发之后再启动您的应用程序，创建您的视图实例并呈现它。

Answer 2

我不确定您要达到什么目标，但您可以尝试这种替代 Derick 解决方案的方法。

Backbone.View.extend({
    el: document.createElement('div'),
    template: null,
    render: function(){
        if(this.template === null){
            this.template = _.template($('#my-template'));
        }
        this.$el.html(this.template({}));
    }
});

请注意，如果您这样做：

var something = _.template('<div><%= haha %></div>');

something当你给它数据时变成一个给你html的函数，你不应该每次都重新编译。