1

我在一个容器 div 中有一些 div 使用foreach绑定绑定到一个淘汰赛 observable 数组。这很好用。

在淘汰赛 afterAdd 事件中，我使用 jQuery 为（新创建的）div 的点击事件创建监听器：

                 mydiv.click(function () { 
                    // delete the corresponding item from 
                    // the observable array                     
                    self.myobservableArray.splice($(this).index(), 1);
                });

单击 div 将其删除。div 从视图中消失。这很好用。

我也让每个 div 都可以拖动： 

                 mydiv.draggable({revert:"invalid"});

拖放工作正常。

但是，如果我在将 div拖放到 droppable 后单击它，它不会消失；它要么依附于可放置对象，要么可放置对象依附于它。需要再次单击 div 才能将其发送到遗忘状态。

我能做些什么来解决这种行为吗？

4

1 回答 1

4

我猜它与事件（同一元素上的多个事件注册）有关，这是我的示例，适用于第一次单击（关闭） jsfiddle.net/dhanasekaran/P9C7E

<div data-bind="foreach:items">
    <a href="#" class="item" data-bind="draggable:true,droppable:true">
        <span  data-bind="text:$data"></span>
        <i data-bind="click:$parent.remove">X</i>
    </a>
</div>

ko.bindingHandlers.draggable={
    init: function(element, valueAccessor, allBindingsAccessor, viewModel) {
        $(element).draggable();
    }
};

ko.bindingHandlers.droppable={
    init: function(element, valueAccessor, allBindingsAccessor, viewModel) {
        $(element).droppable();
    }
};

var vm=function(){
    var self=this;
    self.items=ko.observableArray();
    self.init=function(){
        self.items(['One','Two','Three','Four','Five','Six']);
    }
    self.remove=function(item){
        console.log(item);
        self.items.remove(item);
    }
    self.init();
}

ko.applyBindings(new vm());
于 2013-09-30T12:09:21.327 回答