问很难使用Tinysort对列表进行降序排序
EN

Stack Overflow用户

提问于 2021-03-10 05:57:48

回答 1查看 32关注 0票数 0

我正在尝试使用Tinysort将职位空缺数量的动态列表排序为“从高到低”的顺序，以便在求职页面上使用滑块。我已经分享了我正在使用的代码，在每个列表项的“careerscount”范围内(代替从API中拉入的数据)中的一些任意数字。我不能让列表从最高到最低排序。ASC命令似乎工作得很好，但DESC不会工作。任何关于我的函数哪里出了问题的线索都将不胜感激！

<!DOCTYPE html>
<html>
<head>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/tinysort/2.2.2/tinysort.min.js">
    </script>
    <title></title>
</head>
<body>
    <div class="slick-slider">
        <ul class="your-class list">
            <li class="slide">
                <h3>Customer Success</h3><span class="careerscount" id="customersuccessslidecount">1</span> open roles
            </li>
            <li class="slide">
                <h3>Engineering</h3><span class="careerscount" id="engineeringslidecount">1</span> open roles
            </li>
            <li class="slide">
                <h3>Finance</h3><span class="careerscount" id="financeslidecount">12</span> open roles
            </li>
            <li class="slide">
                <h3 class="name">Insurance</h3><span class="careerscount" id="insuranceslidecount">0</span> open roles
            </li>
            <li class="slide">
                <h3 class="name">Marketing</h3><span class="careerscount" id="marketingslidecount">0</span> open roles
            </li>
            <li class="slide">
                <h3>People</h3><span class="careerscount" id="peopleslidecount">0</span> open roles
            </li>
            <li class="slide">
                <h3>Operations</h3><span class="careerscount" id="operationsslidecount">4</span> open roles
            </li>
            <li class="slide">
                <h3>Product</h3><span class="careerscount" id="productslidecount">9</span> open roles
            </li>
            <li class="slide">
                <h3>Referencing</h3><span class="careerscount" id="referencingslidecount">3</span> open roles
            </li>
            <li class="slide">
                <h3>Sales</h3><span class="careerscount" id="salesslidecount">0</span> open roles
            </li>
            <li class="slide">
                <h3>Support</h3><span class="careerscount" id="supportslidecount">8</span> open roles
            </li>
        </ul>
    </div>

    <script>



    window.onload = function() {
    tinysort('li.slide', 'span.careerscount', {
                   order: 'desc',
                   emptyEnd: false
           });
     

    };




    </script>
</body>
</html>

javascript

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-03-10 06:06:11

根据该库的文档。第二个参数是options对象，因此您需要将选择器和选项组合成一个对象：

        tinysort('li.slide', {
                       selector: 'span.careerscount',
                       order: 'desc',
                       emptyEnd: false
               });

<!DOCTYPE html>
<html>
<head>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/tinysort/2.2.2/tinysort.min.js">
    </script>
    <title></title>
</head>
<body>
    <div class="slick-slider">
        <ul class="your-class list">
            <li class="slide">
                <h3>Customer Success</h3><span class="careerscount" id="customersuccessslidecount">1</span> open roles
            </li>
            <li class="slide">
                <h3>Engineering</h3><span class="careerscount" id="engineeringslidecount">1</span> open roles
            </li>
            <li class="slide">
                <h3>Finance</h3><span class="careerscount" id="financeslidecount">12</span> open roles
            </li>
            <li class="slide">
                <h3 class="name">Insurance</h3><span class="careerscount" id="insuranceslidecount">0</span> open roles
            </li>
            <li class="slide">
                <h3 class="name">Marketing</h3><span class="careerscount" id="marketingslidecount">0</span> open roles
            </li>
            <li class="slide">
                <h3>People</h3><span class="careerscount" id="peopleslidecount">0</span> open roles
            </li>
            <li class="slide">
                <h3>Operations</h3><span class="careerscount" id="operationsslidecount">4</span> open roles
            </li>
            <li class="slide">
                <h3>Product</h3><span class="careerscount" id="productslidecount">9</span> open roles
            </li>
            <li class="slide">
                <h3>Referencing</h3><span class="careerscount" id="referencingslidecount">3</span> open roles
            </li>
            <li class="slide">
                <h3>Sales</h3><span class="careerscount" id="salesslidecount">0</span> open roles
            </li>
            <li class="slide">
                <h3>Support</h3><span class="careerscount" id="supportslidecount">8</span> open roles
            </li>
        </ul>
    </div>

    <script>



    window.onload = function() {
    tinysort('li.slide', {
                   selector: 'span.careerscount',
                   order: 'desc',
                   emptyEnd: false
           });
     

    };




    </script>
</body>
</html>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/66555379

复制

相似问题

问很难使用Tinysort对列表进行降序排序
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问很难使用Tinysort对列表进行降序排序EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问很难使用Tinysort对列表进行降序排序
EN