问题描述
我想以按不同的方式一些div，我完全迷失了方向。我一直在尝试一些东西，但我不知道如何得到它的工作。
I'm trying to sort some DIVS in different ways and I'm quite lost. I've been trying some stuff but I don't see how to get it to work.
我有一组不同的div同一类不同的ID，RELS和数据属性的容器内的。。
I have a set of different divs with the same class, different ids, rels and data-attribute inside a container.
<div id="container">
<div class="sortable" id="div541" rel="1234" data-rel="Name One">
[some inside html including a table and divs]
</div>
<div class="sortable" id="div354" rel="4321" data-rel="Name Two">
[some inside html including a table and divs]
</div>
<div class="sortable" id="div763" rel="112233" data-rel="Name Three">
[some inside html including a table and divs]
</div>
</div>
然后，我有一个＆LT;选择＆gt;在其中用户选择排序类型元素。选项由数值存储的rel属性（升序和降序），并命名为存储的数据rel属性（升序和降序以及）。
Then I have a <select> element in which the user select the sort type. Options are by numeric value "stored" in the rel attribute (ascending and descending) and by name "stored" in the data-rel attribute (ascending and descending as well).
首先，我想到了一个jQuery插件如但克隆的元素改变其ID和我让每个排序的div我需要保持自己的ID从容器外与他们进行互动里面的几个要素。我搜索其他插件，但他们都做了一些整理，但以不同的方式，我决定做这个自己。
First I thought of a jQuery plug-in like Quicksand but it clones the elements changing its ID and I have several elements inside each sortable div which I need to keep their ID to interact with them from outside the container. I searched other plug-ins but they all did some sorting but in a different way and I decided doing this myself.
所以，我做了一些谷歌搜索和stackoverflowing，发现我可以做这样的事情的div进行排序：
So I did some googling and stackoverflowing and found that I can sort the divs by doing something like this:
var ids = ['#div541', '#div354', '#541' ...];
var cont = $('#resultados');
$.each(ids, function(i, v) {
cont.append($(v));
});
但我不得不这样做实际排序前的ID数组进行排序而这也正是我迷路了。
我去之前，这是实现排序的最佳方式？请问container.append部分修改任何ID或复制和DIV？
But I have to sort the IDs array before doing the actual sorting and that's where I'm lost.Before I go on, is this the best way of achieving the sorting? Will the container.append part modify any ID or duplicate and div?
如果这没关系，你能不能帮我做吗？
If it's okay, can you please help me do it?
我首先做一个 $（'。排序）。每个（）在至极我做一个3列数组。于是我排序的相对或数据-rel属性ASC或DESC，一旦数组进行排序我用它来追加（）的div回容器中。这样行吗？我讨厌使用专门的JavaScript数组，所以你可以请给我一只手做一个函数来进行排序，然后取回订单ID列表？
I would first do a $('.sortable).each() in wich I make a 3 "column" array. So then I sort the rel or the data-rel attribute ASC or DESC and once the array is sorted I use it to append() the divs back into the container. Is this okay? I hate using arrays specially in JavaScript, so could you please give me a hand to make a function to sort it and then get the list of IDs back in order?
非常感谢！
推荐答案
这是有趣的方法排序是创建包含有序属性值，sperarator和元素的ID制作的字符串数组。
An interesting method to sort would be to create an array of crafted strings that contain the sorted attribute value, a sperarator and the element's ID.
在您的示例数据字符串数组应该是这样的：
In your example data the string array should look like:
['Name One#div541', 'Name Two#div354', 'Name Three#div763', ...]
如果您想通过数值进行排序：
or if you want to sort by the numeric value:
['0001234#div541', '0004321#div354', '0112233#div763', ...]
请注意，在这种情况下，你应该垫用零的数字字符串所以排序字符串将是正确的。
Note that in that case you should pad the number strings with zeros so the sort by string will be correct.
之后，你可以简单地使用JavaScript 的.sort（）方法阵列上。数组排序后，您可以用分隔之前分析出的数据取的ID。
After that you can simply use the javascript .sort() method on the array. After the array is sorted you can take the IDs by parsing out the data before the delimiter.
如果您想排序是按降序排列，只需要使用 .reverse（）排序后。
If you want the sorting to be in descending order, just use .reverse() after sorting.
您可以将制作的数组转换为所需的ID阵列是这样的：
You can convert the crafted array to your desired IDs array like this:
var idsArray = $.map( craftedArray, function(val, i) {
return val.substring(val.indexOf('#'));
});
这篇关于jQuery的复杂分拣格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！