backbone.js - 骨干（木偶）编辑视图

Question

如何实现可编辑视图？例如，我有一个PersonView. 默认视图将显示人员信息。然后当我双击时，我想进入“编辑模式”，我可以在其中编辑字段。我想你能想象我的意思吗？它的常见“模式”。我该如何实施？“简单”的方式可能是dblClick我用其他东西替换现有的 HTML。但这似乎不对……这怎么办？

Answer 1

您可以通过多种方式实现此目的：交换视图、内联编辑、交换模板

这是一个很好的教程，解释了你需要什么：

http://net.tutsplus.com/tutorials/javascript-ajax/build-a-contacts-manager-using-backbone-js-part-4/

Answer 2

您不能创建另一个视图进行编辑吗？因为您将需要在编辑视图中分开不同的事件。这是我在 jsfiddle 中整理的内容

您基本上可以创建一个新视图，将模型传递给新视图，并将其显示在一个区域中

newValue = ev.target.value;
this.model.set('contentPlacement', newValue)

mainView = new MainView({ model: this.model });
App.mainRegion.show(mainView)

http://jsfiddle.net/cLPfw/

Answer 3

您可以在文本字段中添加一些类，例如.disabled. 您还必须通过添加disabled属性来禁用此字段。然后将 css 规则添加到.disabled类中，使其像纯文本（删除填充、边距、边框等）。然后在dblClick事件中删除类和属性。