jquery-ui - 带有 jQ​​uery UI 拖放的 Knockout Js 在 IE8 中失败

Question

我使用带有jquery拖放功能的knockoutjs，它在Chrome、Firefox、IE9中运行良好，但在IE8中运行不佳。我无法发布实际的代码，但我创建了一个 jsfiddle 示例，可以在其中重现该错误。请看一下http://jsfiddle.net/wired1/P9hns/20/ 它在最新的 Firefox、Chrome 和 IE9 中运行良好。但是在 IE8 中尝试拖动时出现以下错误:

IE8 error #1

SCRIPT5007: Unable to get value of the property 'options': object is null or undefined jquery-ui.1.8.18.js, line 1412 character 13

这是jquery ui中引用​​的代码:

$.ui.plugin.add("draggable", "cursor", {
start: function(event, ui) {
    var t = $('body'), o = $(this).data('draggable').options;
    if (t.css("cursor")) o._cursor = t.css("cursor");
    t.css("cursor", o.cursor);
},
stop: function(event, ui) {

        var o = $(this).data('draggable').options;
        if (o._cursor) $('body').css("cursor", o._cursor);

}
});

这是stop函数中变量o的声明:var o = $(this).data('draggable').options;

如果我在 jquery ui 中注释掉这两行，则会收到以下错误:

IE8 error #2

SCRIPT5007: Unable to get value of the property 'options': object is null or undefined jquery-ui.1.8.18.js, line 1439 character 38

这指向:

$.ui.plugin.add("draggable", "scroll", {
start: function(event, ui) {
    var i = $(this).data("draggable");
    if(i.scrollParent[0] != document && i.scrollParent[0].tagName != 'HTML') i.overflowOffset = i.scrollParent.offset();
},
drag: function(event, ui) {

    var i = $(this).data("draggable"), o = i.options, scrolled = false;
........................

这是上面代码片段的最后一行，其中 o = i.options。

如果我将 {scroll: false} 设置为 jqueryui 可拖动的选项，错误就会消失，但它仍然无法工作。

似乎当我开始拖动所有事件时，即使未释放鼠标单击，所有事件也会按顺序触发(在 jsfiddle 中运行代码测试时，请查看控制台以查看日志)。

这是 jquery ui 问题还是我做错了什么？非常感谢任何对此的帮助。

Answer 1

问题是您在“start”回调中从 observableArray 中删除了学生，这反过来又导致 KO 删除/分离关联的 DOM 元素。但是可拖动的代码依赖于被拖动的元素仍然可用(即使您指定了助手)。

我猜测 IE<9 以不同的方式处理分离的元素，导致错误出现。当明确不再需要关联的可拖动元素时(即当拖动停止时)，可以通过仅从 observableArray 中删除学生来解决此问题。

这是更新后的 fiddle :http://jsfiddle.net/P9hns/32/