Question

我正在尝试将列表对象按字母顺序分组并添加它们的标题。

我的HTML代码：

android:onClick="enterButtonOnClick"

我正在使用的jQuery代码有一些技巧：

<div class="projectLists">
  <ul data-year="france">
    <li>items france</li>   
</ul>
<ul data-year="austria">
    <li>items austria</li>   
</ul>
<ul data-year="united kingdom">
    <li>items united kingdom</li>   
</ul>
<ul data-year="USA">
    <li>items USA</li>   
</ul>
<ul data-year="france">
    <li>items france</li>   
</ul>
<ul data-year="united kingdom">
    <li>items united kingdom</li>   
</ul>
<ul data-year="austria">
    <li>items austria</li>   
</ul>
<ul data-year="USA">
    <li>items USA</li>   
</ul>

我正在努力实现这个观点：

奥地利
- 项目奥地利
- 项目奥地利

法国
- 项目法国
- 项目法国

英国
- 项目英国
- 项目英国

美国
- 项目美国
- 项目美国

我非常感谢你的帮助。工作的JSfiddle在这里：http://jsfiddle.net/1sa3mvpz/

Answer 1

以下代码段生成预期输出：

var years = {}, $plist = $('.projectLists');

$plist.children('div').sort(function (a, b) {
    a = $(a).data('year');
    b = $(b).data('year');
    years[a] = null;
    years[b] = null;
    return String.prototype.localeCompare.call(a.toLowerCase(), b.toLowerCase());
}).appendTo($plist);

$.each(years, function (year) {
    $plist.children('[data-year="' + year + '"]').first().before($('<h5>', {
        text: year.replace(/\b(\w)/g, function (a) {
            return a.toUpperCase()
        })
    }));
});

http://jsfiddle.net/a8rr1zp7/

按数据属性按字母顺序放置对象

1 个答案: