0

我有一个可拖动的列表项，每个项都有数据 id 属性，因此我可以检测它们的顺序。

所以按照正常顺序，它们看起来像这样：

<ol>
   <li data-id='0'>Apple</li>
   <li data-id='1'>Banana</li>
   <li data-id='2'>Cake</li>
   <li data-id='3'>Tea</li>
   <li data-id='4'>Biscuit</li>
</ol>

我还有一个长度与列表项数相同的数组，其中包含每个列表项的数据，并且它在开始时按正常顺序排列，就像列表项一样。

所以在我的一些列表项被拖动之后，它们的顺序发生了变化，所以我需要以同样的方式对数组中的数据进行重新排序。

因此，假设一些列表项已被拖动，它们的顺序（我可以使用 data-id 属性检测到）现在看起来像这样：

<ol>
   <li data-id='0'>Apple</li>
   <li data-id='2'>Cake</li>
   <li data-id='1'>Banana</li>
   <li data-id='4'>Biscuit</li>
   <li data-id='3'>Tea</li>
</ol>

所以我需要以同样的方式更改数组中的顺序。

我怎样才能做到这一点？

4

2 回答 2

1

你可以这样做：

var ordered_array = $('ol li').map(function() {
    return your_array[$(this).data('id')];
}).get();
于 2013-04-28T22:04:35.283 回答
1

不要为数据本身使用数组，维护顺序会相当困难（跟踪每次重新排序）。取而代之的是，使用一个通过它的 id 存储数据的对象（好的，该对象甚至可以是数字 id 的数组）和一个存储 id 顺序的数组：

var data = {
    0: …,
    1: …
};
var order = $(that_ol).children().map(function() {
    return $(this).attr("data-id");
}).get();

如果您真的需要数组中的数据，只需使用

$.map(order, function(id) { return data[id]; })
于 2013-04-28T22:23:55.803 回答