jQuery UI sortable 返回 ul，但我真正想要的是两个 li

发布于 2024-11-08 04:56:12 字数 370 浏览 1 评论 0原文

我使用 jQuery UI sortable 允许用户随机播放列表，但停止事件返回整个列表。

所以我处理：

$(this).children('li').each(function(index) {

但我真正想做的是只处理受影响的范围。我想我需要的是：正在拖动的列表项，以及它放置在之前（或之后，以方便者为准）的列表项。这样我就可以更新受影响的列表中的范围，而不必更新整个列表。

也许我应该继续向每个列表项添加一个 data-Counter 属性，看看它们是否与索引不同。

原文

I'm using jQuery UI sortable to allow the user to shuffle the list, but the stop event returns the entire list.

So I process:

$(this).children('li').each(function(index) {

But what I really want to do is process only the range that's affected. I suppose what I need is: the list item that is being dragged, and the list item that it is being placed before (or after, which ever is convenient). That way I can update the range within the list that is being affected, and not have to update the entire list.

Maybe I should just keep add a data-Counter attribute to each list item and see if they are different from the index.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

无声情话 2024-11-15 04:56:12

如果您在拖动开始时保存项目的开始位置，您可以轻松解决这个问题。

$('ul').sortable({
    start: function(event,ui){
        ui.item.data('index',ui.item.index());
    },
    stop: function(event,ui){
        var startIndex = parseInt(ui.item.data('index'),10);
        var stopIndex = ui.item.index();

        var msg = '';
        msg += 'id of item: ' + ui.item.attr('id') + '\n';
        msg += 'start index: ' + startIndex + '\n';
        msg += 'stop index: ' + stopIndex + '\n';
        msg += 'prev item id: ' + ui.item.prev().attr('id') + '\n';
        msg += 'next item id: ' + ui.item.next().attr('id') + '\n';

        alert(msg);
    }
});

试试我的演示：http://jsfiddle.net/b8uJ8/

You can easily work it out if you save the item's start position when dragging starts.

$('ul').sortable({
    start: function(event,ui){
        ui.item.data('index',ui.item.index());
    },
    stop: function(event,ui){
        var startIndex = parseInt(ui.item.data('index'),10);
        var stopIndex = ui.item.index();

        var msg = '';
        msg += 'id of item: ' + ui.item.attr('id') + '\n';
        msg += 'start index: ' + startIndex + '\n';
        msg += 'stop index: ' + stopIndex + '\n';
        msg += 'prev item id: ' + ui.item.prev().attr('id') + '\n';
        msg += 'next item id: ' + ui.item.next().attr('id') + '\n';

        alert(msg);
    }
});

Try my demo: http://jsfiddle.net/b8uJ8/

回复收藏 0 原文

~没有更多了~