1

我有一个正在呈现我的模板的视图 - 该模板由许多元素组成，我正在使用 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 ？

4

1 回答 1

2

我不认为有很多方法可以解决它。editable()必须在 dom 元素准备好使用插件操作之后进行调用。由于您要替换 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 时不断更新它。

于 2012-12-20T19:45:58.270 回答