1

我想对包含项目的列表进行排序。排序应基于每个项目的数据元素。

奇怪的是，如果你在你的电脑上本地尝试它可以工作（下载我的sortingtest.html），但它不能在jfiddle在线工作，更重要的是在手机上！

您是否知道我的代码有什么问题，或者我怎样才能做得更好，以便它也可以在手机上运行？

编码：

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script>
    function sortEntries() {    
        var elems = $('#mylist').children('li').remove();
        elems.sort(function(a,b){ 
            return parseInt($(b).data('vote')) > parseInt($(a).data('vote'));
        });
        $('#mylist').append(elems);
    }
    </script>
</head>

<body>

    <ul id="mylist">
        <li data-vote="2">Vote: 2</li>
        <li data-vote="4">Vote: 4</li>
        <li data-vote="1">Vote: 1</li>
        <li data-vote="5">Vote: 5</li>
        <li data-vote="3">Vote: 3</li>
    </ul>

    <a href="#" onClick="sortEntries();">Sort me!</a>

</body>
</html>

JFiddle：http: //jsfiddle.net/Q82Qu/

HTML 文件下载：（另存为） https://copy.com/c0Ogb8wLtRrg

提前非常感谢，斯蒂

4

2 回答 2

1 
var elems = $('#mylist').children('li').remove();

上面的代码所做的是DOM从文档中删除，因此您不能将其用作elems.sort(

<html>
<head>
    <script src="js/jquery.js"></script>
    <script>
    function sortEntries()
    {
        var elems = $('#mylist').children('li');
        elems.sort(function(a,b){ 
            return parseInt($(b).data('vote')) > parseInt($(a).data('vote'));
        });
        $('#mylist').append(elems);
    }
    </script>
</head>

<body>

    <ul id="mylist">
        <li data-vote="2">Vote: 2</li>
        <li data-vote="4">Vote: 4</li>
        <li data-vote="1">Vote: 1</li>
        <li data-vote="5">Vote: 5</li>
        <li data-vote="3">Vote: 3</li>
    </ul>

    <a href="#" onClick="sortEntries();">Sort me!</a>

</body>
</html>
于 2013-03-09T10:25:24.537 回答
1

我自己整理了一下：

关键是使用这个排序代码：

elems.sort(function(a,b){ 
    return $(b).attr('data-vote') - $(a).attr('data-vote');
});
于 2013-03-13T08:33:50.927 回答