为什么jQuery UI Dragable会干扰敲除JS数据绑定？

我想理解为什么在下面的代码中将包含div的内容变成jqueryui的draggable会改变Knockout JS数据绑定的行为

在第一个div（可拖动）中，对输入框中的文本进行更改并立即单击Save不会导致更改反映在observable中。在第二个div（不可拖动）中，变化反映在可观察到的：

拖动
拯救
固定的
拯救

使用以下支持Javascript：

VM={
细节：可观察到的（“猫”），
saveEdit:function（）{
警报（this.detail（））；
}
};
$（文档）.ready（函数（）{
$（“#可拖动”）.draggable（）；
ko.应用绑定（VM）；
});

您可以在下面的jsFiddle中看到正在运行的代码：

如果将可拖动输入框中的文本更改为Cath并单击“保存”，则警报将显示“Cat”。但是，如果在固定输入框中执行相同操作，则警报将显示“Cath”。因此，在第二种情况下，敲除检测到值的变化，而在第一种情况下，它没有

我知道，我可以通过使用敲除值更新绑定来实现预期效果，强制它在每次按键后更新绑定的可观察值。像这样：

我也知道，如果我把a改成a，我会得到我期望的行为

---

我想了解的是为什么会发生这种情况，以及我如何能够实现我想要的效果（即，一个可拖动的，并在其中的元素上绑定正常的敲除值）无需在我的代码中添加valueUpdate绑定或使用按钮绕过问题。

可拖动的

插件捕获鼠标以提供其功能。因此，当你点击你的
span
时，插件会处理点击事件，敲除不会得到通知

当您使用
按钮时，它会起作用，因为按钮不受可拖动插件的影响

因此，您需要从
draggable
插件中排除
span
，例如在标记类的帮助下使用：

$("#draggable").draggable({cancel: "input,textarea,button,select,option,.save"});

演示。
jQuery UI draggable似乎正在影响模糊事件，这就是为什么如果指定
valueUpdate
绑定，它会起作用。这里描述了一个类似的错误：