Question

我有一些拖累和丢弃代码，它可以正常工作。只是有一点询问。我注意到如果我在drop函数中添加一个警报用于调试目的（例如alert（draggedItem.text（））;）当我将某些内容放入可拖动区域时，它会触发警报两次。我在另一篇文章中读过使用droppable＆amp; amp;可以一起排序导致这个奇怪的双重事件发生。但我需要使用droppable事件来获取拖动的项目对象（ui.draggable） - 这样我就可以在删除它时操作它。如果有任何其他方式获得可拖动对象，请告诉我:)如果你有解释为什么会发生这种情况，那将是有趣的...

$(".field > li").draggable({
    helper:'clone',
    opacity: 0.4,
    connectToSortable:'.dragrow'
});

$(".dragrow").droppable({
    drop: function(e, ui) {
        draggedItem = ui.draggable;
        //alert(draggedItem.text());
    }
}).sortable({ //code here to do stuff with 'draggedItem'

我还有另外一个与此相关的查询，但由于我的代码很大，我无法在这里发布完整的内容。所以我明白，如果你无法提供帮助 - 只要有些事情让人想起来真的很酷。基本上我有一个'块'列表，我可以拖动到多行。可以使用toggle事件隐藏各个行。如果我有3行，我可以将块拖动到其中任何一行。如果我然后隐藏第一个，我现在无法拖入另外两行。我仍然可以对它们进行排序。一旦我开始对它们进行排序，我就可以再次拖入它们。奇怪的...

Answer 1

检查演示http://jsfiddle.net/yeyene/FUyTe/1/

如你所说，是的，使用droppable＆amp;可以一起排序导致这个奇怪的双重事件发生。但是，如果您仍想使用draggedItem object，您仍然可以将其与可排序的接收选项一起使用。

此外，您可以使用ui.item来获取当前拖动的元素。

尝试评论和关闭每个警报并查看，现在它只会触发一次。

$(".field > li").draggable({
    helper:'clone',
    opacity: 0.4,
    connectToSortable:'.dragrow'
});

$(".dragrow").droppable({
    drop: function(e, ui) {
        draggedItem = ui.draggable;
    }
}).sortable({ 
    receive: function(e, ui) {
        // here is the draggedItem object of "droppable"
        alert(draggedItem.text());

        // here is the draggedItem object of "sortable"
        draggedItem2 = ui.item;
        //alert(draggedItem2.text());
    }
});

这是修改被删除元素的html的一种方法。

DEMO http://jsfiddle.net/yeyene/7fEQs/8/

Answer 2

您是否检查过您的网站上没有两次jquery脚本标记？

jquery可排序/可拖动双事件触发

2 个答案:

尝试评论和关闭每个警报并查看，现在它只会触发一次。

这是修改被删除元素的html的一种方法。