“清理”敲除绑定后 jQuery 事件未触发答案

【问题标题】：jQuery events not firing after "cleaning" Knockout bindings“清理”敲除绑定后 jQuery 事件未触发
【发布时间】：2015-06-23 17:16:05
【问题描述】：

在我的项目中，我有一个 <div>，我专门在其中应用了我的 Knockout.js 绑定。我必须根据用户点击的内容在该区域实例化不同的视图模型。

为了防止出现无法在同一个元素上调用绑定两次错误，我首先必须“清理”绑定以使该区域再次可用。我调用初始的applyBindings() 函数：

ko.applyBindings(new ViewModel("Planet", "Earth"), document.getElementById("bindings-area"));

最后，我会清理 <div> 并调用新的绑定：

var element = $("#bindings-area")[0];
ko.cleanNode(element);
ko.applyBindings(new ViewModel("NEW", "Bindings"), document.getElementById("bindings-area"));

问题：当我在 #bindings-area div 中包含一个 HTML 按钮时，在我清理绑定并实例化新模型后，它将不再起作用。我确信这与 ko.cleanNode() 函数以某种方式删除了 button 绑定有关。我怎样才能重新启动它们或首先阻止cleanNode() 对按钮进行操作？

小提琴： http://jsfiddle.net/jL6L01xs/2/

【问题讨论】：

标签： javascript jquery html button knockout.js

【解决方案1】：

Knockout documentation 很好地描述了这个问题。这句话描述了问题所在以及需要做什么：

删除元素时，Knockout 会运行逻辑来清理所有数据与元素相关联。作为此逻辑的一部分，Knockout 调用 jQuery 的 cleanData 方法，如果 jQuery 已加载到您的页面中。在高级方案，您可能希望阻止或自定义此数据的方式在您的应用程序中删除。 Knockout 暴露一个函数， ko.utils.domNodeDisposal.cleanExternalData(node)，可以重写以支持自定义逻辑。比如防止cleanData 被调用后，可以使用一个空函数来替换标准cleanExternalData 实现：
ko.utils.domNodeDisposal.cleanExternalData = function () {
    // Do nothing. Now any jQuery data associated with elements will
    // not be cleaned up when the elements are removed from the DOM.
};

这是更新后的jsFiddle。

【讨论】：