JQuery UI Sortable 接收前禁用更新功能

Question

我正在使用 jquery ui 处理一个列表，您可以在其中排序，然后也在另一个列表之间排序。我正在使用更新进行内部排序，效果很好。当我在两者之间排序时，我只想调用接收函数而不是更新。目前，更新被调用，然后接收被调用。在列表之间排序时有什么方法可以跳过更新调用吗？

<script>
            $ = jQuery
            $(function() {
                $( "#sortable1).sortable({
                    connectWith: ".connectedSortable",
                    placeholder: "ui-state-highlight",
                    update: function(event, ui) {processSortWithin(ui.item.attr("id"), ui.item.index()); },
                    receive: function(event, ui){ 
                        processSortBetween(ui.item.attr("id"), ui.item.index(),ui.sender.attr("id"));
                    }
                }).disableSelection();
            });

        </script>

Answer 1

答案来自： http://forum.jquery.com/topic/sortables-更新回调和连接

update: function(e,ui) {
    if (this === ui.item.parent()[0]) {
        //your code here
    }
}

Answer 2

我今天遇到了类似的问题，我找到的唯一解决方案是引入一个标志变量，该变量在 update 事件期间设置，并在 stop 事件期间检查。

在您的示例中，您使用 receive 事件，该事件将在从其他列表接收新元素的列表上触发，因此应将其设置在 $(".connectedSortable").sortable( ) 选项。

以下是我区分是否排序（在一个列表内，在 stop 中处理）或移动（在两个列表之间，在 receive 中处理）的方法：

$(function() {
    position_updated = false; //helper flag for sortable below

    $(".sortable").sortable({
        connectWith: ".sortable",
        update: function(event, ui) {
            position_updated = !ui.sender; //if no sender, set sortWithin flag to true
        },
        stop: function(event, ui) {
            if (position_updated) {
                processSortWithin(ui.item.attr("id"), ui.item.index());
                position_updated = false;
            }
        },
        receive: function(event, ui) {
            processSortBetween(ui.item.attr("id"), ui.item.index(),ui.sender.attr("id"));
        }
    }).disableSelection();
});

function processSortWithin(id, position) {
    alert("sort within");
}

function processSortBetween(id, position, sender_id) {
    alert("sort between");
}

工作示例：http://jsfiddle.net/myLff/2/

Answer 3

试试这个：

update: function(e,ui) {
   if (!ui.sender) {
       //your code here
   }
}