Question

我有一个渲染模板的视图 - 模板由许多元素组成，我使用jquery插件进行内联编辑。通过对每个div的.editable（）调用，可以对元素进行编辑。

我有一个包含以下元素的模板：

<div id="pricing">some value</div>
<div id="terms">some other value</div>

每次重新渲染视图时，我的元素都会失去.editable（）能力。该插件应用它自己的类名等。

在我的视图渲染中，我能够通过以下方式完成这项工作：

var MyView = new Backbone.View.extend({ 

    render: function() { 
        var html = this.template(this.model.toJSON());
        this.$el.html(html);
        this.$el.find('#pricing').editable();
        this.$el.find('#terms').editable();    
});

有没有更好的方法来做到这一点，而没有在视图的渲染方法中明确声明.editable（）到我需要的每个div？

Answer 1

我认为有很多方法可以解决它。在准备好使用插件操作dom元素之后，必须调用editable()。由于您要替换HTML，因此必须等到视图重新呈现。我建议给你需要的div来编辑他们自己的类editable。然后你可以使用类选择器而不是分别为每个div做这个。

<div id="pricing" class="editable">some value</div>
<div id="terms"  class="editable">some other value</div>

然后你可以这样做：

this.$(".editable").editable(); //or this.$el.find('.editable').editable();
//instead of 
this.$el.find('#pricing').editable();
this.$el.find('#terms').editable();  
//etc.

这样可以节省您为每个div编写新的呼叫，并且在添加/删除视图中的div时，您不必经常更新它。

如何将jquery函数重新附加到呈现的模板？

1 个答案: