Question

我目前正在开发一个利用jquery sortable的小项目。所需的功能是允许用户将项目从一个列表拖动到另一个列表，但阻止它们在项目最初所在的同一容器中拖放。

在下面的示例中，我希望用户能够从“未成年人”中自由拖动项目。到主要的＆＃39;反之亦然，但要阻止他们从“未成年人”中移动物品。小调＆＃39;或者＆＃39;主要＆＃39;到主要的＆＃39;。

我尝试在多个事件中比较当前项目的ID，但尚未找到解决方案。

$('#minor ul').sortable({
    cursor: "move",
    connectWith: "#major ul",
    beforeStop : function(){
       //parent id == original container id
    },
    stop : function(){
       //parent id == original container id
    }
});

非常感谢任何提出解决方案的帮助。

Answer 1

经过一些js调试后，我能够在事件中获得 currentContainer 对象。从那里我刚刚检查了容器的id是否与原始id相同，如果为true则取消该事件。更新了JSFiddle：http://jsfiddle.net/r34u2pbo/1/

$('#minor ul').sortable({
    cursor: "move",
    connectWith: "#major ul",
    stop : function(){
        var div = $(this).data().sortable.currentContainer.element
        var id = $(div).parent('div').attr('id')
        if(id == 'minor'){
            $(this).sortable('cancel')
            alert('cannot drag within same container')
        } 
    }
});

jQuery Sortable：如果在同一容器中，则取消拖动事件

1 个答案: