如何在不解除绑定事件的情况下分离然后重新附加 Backbone.View？

Question

我有一个由嵌套子视图组成的主干系统，我偶尔需要在其中执行以下操作。

1. 从 DOM 中分离子视图
2. 从头开始​​重新渲染父视图（从模板）
3. 在正确的位置重新附加子视图 来

我通过调用类似 $(parent.el).html(...) 然后调用 $(parent.el).append(child.el)

做到这一点我经常看到这种技术会导致子进程的事件处理程序丢失。所以我尝试了很多方法，但到目前为止都没有效果。

1. 首先使用 $.detach() 分离 child.el
2. 克隆 child.el 节点并重新附加克隆
3. 重新附加后再次调用 child.delegateEvents()

唯一对我有用的是完全重建子节点从头开始查看。有人有什么想法吗？重新连接现有节点会更加高效。

谢谢！

Answer 1

我刚刚遇到了类似的问题。这似乎对我有用：

this.undelegateEvents();
this.$el.hide();
this.$el.detach();

// do whatever here

this.$el.appendTo(containerElement);
this.delegateEvents();
this.$el.slideDown('fast');

我仍然不确定为什么事件侦听器消失，尽管当我查看 Chrome 开发人员工具窗口时我可以确认它们实际上已经消失了。这很奇怪，因为 Roatin Marth 有一个示例（http://jsfiddle.net/Xcrhb/1），其中不会出现这个问题。

Answer 2

我也这么做。

// First of all pre-render child view
childView.render();

// Append in one place
parentView.$el.append(childView.el);

// Detach in another place
childView.$el.detach();

// And append it again
parentView.$el.append(childView.el);

Answer 3

你想要做的事情对于 Backbone 来说似乎是 hack 式的。您最好通过设置事件委托和重新渲染视图来使用本机功能，而不是分离、克隆、更改和重新附加。这样做并不会提高任何性能。

如果您解释了为什么需要这样做以及为什么本机 Backbone 做事方式不适合您，那么提供帮助会容易得多。