Question

我正在尝试使用 tinysort 对数据属性进行排序。

首先是清单：

<ul id="late-services" class="list">
<li data-service-id="23" data-criticality="1000">
    <span>Service 23</span>
    <span class="list-collapse ui-icon ui-icon-carat-1-s"></span>
    <span class="service-zone">Cannes</span>
    <div class="list-item-belly" style="display: none;">
        <div>Deadline dans 1 semaine.</div>
        <div>Le client n'a pas confirmé.</div>
    </div>
</li>
<li data-service-id="22" data-criticality="2000">
    <span>Service 22</span>
    <span class="list-collapse ui-icon ui-icon-carat-1-s"></span>
    <span class="service-zone">Cannes</span>
    <div class="list-item-belly" style="display: none;">
        <div>Deadline dans 1 semaine.</div>
        <div>Le client n'a pas confirmé.</div>
    </div>
</li>
<li data-service-id="24" data-criticality="500">
    <span>Service 24</span>
    <span class="list-collapse ui-icon ui-icon-carat-1-s"></span>
    <span class="service-zone">Cannes</span>
    <div class="list-item-belly" style="display: none;">
        <div>Deadline dans 1 semaine.</div>
        <div>Le client n'a pas confirmé.</div>
    </div>
</li>               
</ul>

然后打电话给tinysort：

$('ul#late-services>li').tsort('li', {data:'serviceId'});

我一定是做错了什么但不知道是什么......

Answer 1

您的代码的Hiya 工作演示：http://jsfiddle.net/wJzNE/15/

已更新：使用data: (option)在此处实施：http://jsfiddle.net/wJzNE/49/ ＆安培; http://jsfiddle.net/wJzNE/52/ [code] $（'ul＃late-services＆gt; li'）。tsort（'span'，{data：'serviceid'}）;

有用的链接：http://tinysort.sjeiti.com/

问题 1）注意到内部错误的attr值和2） tsort内部没有必要注意这里的区别：$('ul#late-services>li').**tsort({attr:'data-service-id'})**;

<强> HTML

<!DOCTYPE html>
<html dir="ltr">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
    <script type="text/javascript" src="http://tinysort.sjeiti.com/scripts/jquery.tinysort.js"></script>


  </head>
  <body>
<ul id="late-services" class="list">
<li data-service-id="23" data-criticality="1000">
    <span>Service 23</span>
    <span class="list-collapse ui-icon ui-icon-carat-1-s"></span>
    <span class="service-zone">Cannes</span>
    <div class="list-item-belly" style="display: none;">
        <div>Deadline dans 1 semaine.</div>
        <div>Le client n'a pas confirmé.</div>
    </div>
</li>
<li data-service-id="22" data-criticality="2000">
    <span>Service 22</span>
    <span class="list-collapse ui-icon ui-icon-carat-1-s"></span>
    <span class="service-zone">Cannes</span>
    <div class="list-item-belly" style="display: none;">
        <div>Deadline dans 1 semaine.</div>
        <div>Le client n'a pas confirmé.</div>
    </div>
</li>
<li data-service-id="24" data-criticality="500">
    <span>Service 24</span>
    <span class="list-collapse ui-icon ui-icon-carat-1-s"></span>
    <span class="service-zone">Cannes</span>
    <div class="list-item-belly" style="display: none;">
        <div>Deadline dans 1 semaine.</div>
        <div>Le client n'a pas confirmé.</div>
    </div>
</li>               
</ul>


    </body>
</html>

<强> JqueryCode

$('ul#late-services>li').tsort({attr:'data-service-id'});

希望这会有所帮助，欢呼

Answer 2

在你的情况下，这个应该工作： $（'ul＃late-services'）。tsort（'li'，{attr：'data-service-id'}）;

使用tinysort和data属性排序

2 个答案: