2

我正在使用来自 Jquery UI 的可排序。每次我从 resultPos 获取值时，它都会给我最后一步，但请记住最后一个命令。我需要重置它。

例如，我有 3 个元素：

Move 3rd element to 2nd position: end=1&end=3&end=2
Again ...
Move 3rd element to 2nd position: end=1&end=2&end=3
Again ...
Move 3rd element to 2nd position: end=1&end=3&end=2

我需要有一些东西可以返回给我以下内容：

Move 3rd element to 2nd position: end=1&end=3&end=2
Again ...
Move 3rd element to 2nd position: end=1&end=3&end=2
Again ...
Move 3rd element to 2nd position: end=1&end=3&end=2

这是我的代码：

$( ".sortableChip" ).sortable({
        revert: true,
        containment: "#carousel",
        axis: "x",
        items: 'li.edited',
        tolerance: 'pointer',
        placeholder: 'draggin-space',
        start: function(event, ui) { 
             var startPos = $('.sortableChip').sortable('serialize',{ key: 'start'});
        },
        sort: function(event, ui) {
            ui.item.addClass('draggin');
            $('.remove-chart').hide();
        },
        update: function(event, ui) {
            var resultPos = $('.sortableChip').sortable('serialize',{ key: 'end'});
            ui.item.removeClass('draggin');
        }
    });
4

1 回答 1

3

jquery UI 中可排序的每个项目都是一个 LI，有几种方法可以做到这一点，一种方法是在页面最初加载时保存一个具有可排序列表内容的变量，就像在文档准备部分中一样。它所做的只是重新排列 ul 标签内的 li 标签的顺序。

<script type="text/javascript">

    $(document).ready(function(){


         $('#link').click(function(){

            //this will empty out the contents of the ul
            $('.sortableChip').html('');
            /*this will replace the contents of the ul with 
            contents that were caputred 
            */
            $('.sortableChip').html(reset);

        });

    });

    var reset = $('.sortableChip').html();
    /*this is here at the bottom because you want to everything that is created     
    dynamically with jquery or javascript to be captured also.
    */
</script>

您基本上所做的只是在单击链接后返回正确的设置，仅此而已，您实际上不需要此行 `$('.sortableChip').html(''); 但我把它放在这里是为了让你知道它正在被清空和替换

如果需要根据您单击的内容对它们进行排序，您可以将您想要的状态保存为变量，例如重置，然后简单地清除内容并根据用户单击的内容加载变量

于 2012-05-24T20:11:00.177 回答