2

我正在使用这个非常方便的插件对元素进行排序。但是在数值上比较元素会产生不正确的结果：99、98、9、83、8、78 等。

这是插件的问题还是我实现它的方式的问题？

代码：

<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script language="javascript">
jQuery.fn.sortElements = (function(){
    var sort = [].sort;
    return function(comparator, getSortable) {
        getSortable = getSortable || function(){return this;};
        var placements = this.map(function(){

            var sortElement = getSortable.call(this),
                parentNode = sortElement.parentNode,
                nextSibling = parentNode.insertBefore(
                    document.createTextNode(''),
                    sortElement.nextSibling
                );

            return function() {

                if (parentNode === this) {
                    throw new Error(
                        "You can't sort elements if any one is a descendant of another."
                    );
                }
                parentNode.insertBefore(this, nextSibling);
                parentNode.removeChild(nextSibling);
            };

        });
        return sort.call(this, comparator).each(function(i){
            placements[i].call(getSortable.call(this));
        });
    };
})();

$(document).ready(function(){

    $('.item').sortElements(function(a,b){
        return $(a).html() < $(b).html() ? 1 : -1;
    });

});
</script>
</head>
<body>

<% for i = 0 to 100 %>
<div class="item"><%=i*Rnd%></div>
<% next %>

</body>
</html>
4

2 回答 2

3

如果要根据字符串的数值进行排序，则使用parseInt MDN docs方法将字符串转换为数字

$('.item').sortElements(function(a,b){
        return parseInt($(a).html(),10) < parseInt($(b).html(),10) ? 1 : -1;
    });

（或浮点数的parseFloat MDN 文档，正如 Gaurav 在评论中提到的那样。 ）

于 2012-06-13T21:38:54.020 回答
0

您正在比较字符串。在 Javascript"88" < "9"中，但是（显然）88 > 9，或（+"88" > +"9"）。您应该在比较函数中将字符串转换为数字：

return +$(a).html() < +$(b).html() ? 1 : -1;
于 2012-06-13T21:38:27.763 回答