Question

我想通过使用匹配从类名中提取数字来重新排列我的列表顺序（我改编了post中的代码），但它不起作用。这是我的代码：

HTML：

<ul class="class-of-ul">
    <li><a href="#" class="class-of-li-66">66</a></li>
    <li><a href="#" class="class-of-li-69 current-li">69</a></li>
    <li><a href="#" class="class-of-li-65" >65</a></li>
    <li><a href="#" class="class-of-li-68" >68</a></li>
    <li><a href="#" class="class-of-li-67" >67</a></li>
</ul>

jQuery：

$(document).ready(function() {
    $("ul").append($("li").get().sort(function(a, b) {
        return parseInt($(a).attr("class").match(/\d+/)) - parseInt($(b).attr("class").match(/\d+/))
    }));
});

这是jsfidle link

Answer 1

class用于a内的li元素，因此您需要使用.find()来获取anchor元素并找到其类

$(document).ready(function () {
    $("ul").append($("li").get().sort(function (a, b) {
        return $(a).find('a').attr('class').match(/\d+/) - $(b).find('a').attr('class').match(/\d+/)
    }));
});

演示：Fiddle

Answer 2

因为您要对li元素进行排序，但它们没有任何类。 a元素有。{1}}。将您的班级移到li元素，一切都会好起来的。

http://jsfiddle.net/d8gfk/3/

<ul class="class-of-ul">
    <li  class="class-of-li-66"><a href="#">66</a></li>
    <li  class="class-of-li-69 current-li"><a href="#">69</a></li>
    <li  class="class-of-li-65" ><a href="#">65</a></li>
    <li  class="class-of-li-68" ><a href="#">68</a></li>
    <li  class="class-of-li-67" ><a href="#">67</a></li>
</ul>

或者，您可以检查排序中每个a内的li。

使用jQuery重新排序列表项，方法是提取类名

2 个答案: