Question

我想对我的div进行排序。他们都共享同一个班级。这是代码。但它不起作用。

脚本

function sort() {
  for (var i = 0; i < $(".abc").length; ++i) {
    for (var j = 0; j < $(".abc").length - i; ++j) {
      var c1 = parseInt($(".abc").eq(j).children(".pop").text());
      var c2 = parseInt($(".abc").eq(j + 1).children(".pop").text());
      if (c1 > c2) {
        var $temp = $(".abc").eq(j).(clone(true));
        $(".abc").eq(j) = $(".abc").eq(j + 1).(clone(true));
        $(".abc").eq(j + 1) = $temp;
      }
    }
  }
}

完整的代码在https://jsfiddle.net/4m8eneez/3/

此外，我想知道比这更好的方法。使用each（）可以使它变得更简单吗？请给出快速排除这些div的提示。

提前Thanx：）

Answer 1

使用jQuery.sort方法

function sort() {
  var sorted = $('.abc').sort(function(a, b) {
    return +b.textContent < +a.textContent;
  });
  $('#wrapper').html(sorted);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<body>
  <div id="wrapper">
    <div id="m1" class="abc">
      <span class="pop">2</span>
    </div>
    <div id="m2" class="abc">
      <span class="pop">3</span>
    </div>
    <div id="m3" class="abc">
      <span class="pop">1</span>
    </div>
    <div id="m4" class="abc">
      <span class="pop">7</span>
    </div>
  </div>
  <br>
  <button id="sort" onclick="sort()">
    Sort
  </button>
</body>

基于内部元素的冒泡div类型

1 个答案: