1

如何使用 jquery 通过 asc 和 desc 更改每个 html 包装内部标记值之一?

<div class="wrap_0">
    <div class="sort_by">0</div>
</div>
<div class="wrap_1">
    <div class="sort_by">3</div>
</div>
<div class="wrap_2">
    <div class="sort_by">1</div>
</div>

改成

<div class="wrap_0">
    <div class="sort_by">0</div>
</div>
<div class="wrap_2">
    <div class="sort_by">1</div>
</div>
<div class="wrap_1">
    <div class="sort_by">3</div>
</div>

现在我只找到了对一个 wrap 内部 div 进行排序的方法

var items = $('.wrap div').get();
items.sort(function(a,b){
    var keyA = $(a).text();
    var keyB = $(b).text();

if (keyA < keyB) return -1;
if (keyA > keyB) return 1;
    return 0;
});
var wrap = $('.wrap');
$.each(items, function(i, sort_by){
    wrap.append(sort_by);
});
4

2 回答 2

0

这个怎么样?它获取所有以 class 开头的元素wrap_,找到带有 class 的子 divsort_by并比较每个元素。排序后,它会遍历每个元素body并以正确的顺序将其附加到父/包装元素(在本例中):

$("div[class^='wrap_']").get().sort(function(a, b) {
   var idx = parseInt($(a).find(".sort_by").text(),10);
   var idx2 = parseInt($(b).find(".sort_by").text(),10);
   return idx > idx2;
}).each(function() {
   $(this).appendTo("body");
});

小提琴

于 2013-07-17T09:05:35.033 回答
0

这是一个简单的解决方案,即使元素不在主体的根或不是其容器的第一个元素,它也可以工作:

var s = $('[class^=wrap_]').get().sort(function(a,b){
   return parseInt($('.sort_by', a).html(),10)-parseInt($('.sort_by', b).html(),10)
});
for (var i=s.length;i>0;i--) $(s[i]).insertAfter(s[0]);

示范

于 2013-07-17T09:06:49.977 回答