Question

我有以下HTML架构

<div id="txm_left_column">
    <div class="id">
        <h2>Some Name1</h2>
        <div>// another list</div>
    </div>
    <div class="id">
        <h2>Some Name2</h2>
        <div>// another list</div>
    </div>
</div>

用户可以将项目添加到该列表中，并且所有Divs应按h2中的名称按字母顺序排列。我有两个选择

1）我需要能够在字母顺序正确的2个div之间插入一个新项目

2）完全整理清单。

我的方法是选项2，按照Divs

中的名称按字母顺序对h2进行排序

我想出了以下代码来尝试订购它，但是这段代码创建了一个没有H2 s的新订单div列表。然后我尝试通过使用相同的函数来做选项1）但是尝试插入像这样的(upA < upB) ? -1 : (NEW_ITEM_NAME> upB) ? 1 : 0这样的东西，但这会导致问题，因为这不会破坏排序。

我想知道两件事，一个是我怎么能打破排序，因为0不会破坏它。或者我如何组织我的清单的任何帮助。

由于

jQuery("#txm_left_column > div").children("h2").sort(function(a, b) {
    var upA = jQuery(a).text().toUpperCase();
    var upB = jQuery(b).text().toUpperCase();
    return (upA < upB) ? -1 : (upA > upB) ? 1 : 0;
}).appendTo(selector);

Answer 1

但是这段代码创建了一个没有div的有序H2的新列表。

那是因为您要排序h2元素而不是div元素：

jQuery("#txm_left_column > div").sort(function(a, b) {
    var upA = jQuery('> h2', a).text().toUpperCase();
    var upB = jQuery('> h2', b).text().toUpperCase();
   // ...
}).appendTo(selector);

Answer 2

希望发表评论，但尚未达到＆＃34; 50声誉＆＃34;配额，

在引入重复项时，Vohuman的回答是有问题的：

<div id="txm_left_column">
<div class="id">
    <h2>80</h2>
    <div>// another list for name 80</div>
</div>
<div class="id">
    <h2>80</h2>
    <div>// another list for name 80</div>
</div>
<div class="id">
    <h2>81</h2>
    <div>// another list for name 81</div>
</div>
<div class="id">
    <h2>100</h2>
    <div>// another list for name 100</div>
</div>
<div class="id">
    <h2>100</h2>
    <div>// another list for name 100</div>
</div>
</div>

-

jQuery("#txm_left_column > div").sort(function(a, b) {
var upA = jQuery('h2', a).text().toUpperCase();
var upB = jQuery('h2', b).text().toUpperCase();
return upA < upB;
}).appendTo('#txm_left_column');

结果：

81
// another list for name 81

80
// another list for name 80

80
// another list for name 80

100
// another list for name 100

100
// another list for name 100

请参阅http://jsfiddle.net/std57rm4/

只有在引入重复的名称或编号时才会发生这种情况

此刻我没有解决方案，但它应该是计算在排序时遇到重复次数的次数，然后在下一个排序项或项中添加或减去该数字的行取决于您在

中排序的升序或降序

如何根据内容对嵌套的div进行排序

2 个答案: