0

我正在使用一个名为 Perch 的 CMS,我需要将这个动态加载的列表排序为不同的顺序。我不能从 CMS 方面做到这一点,我希望能找到一种方法在前端使用 jQuery 来做到这一点。有可能的?这是 CMS 输出代码的方式。

<ul>
    <li><a href="archive-r.php?tag=appetizers" rel="tag">Appetizers (4)</a></li>
    <li><a href="archive-r.php?tag=beverages" rel="tag">Beverages (2)</a></li>
    <li><a href="archive-r.php?tag=breakfast" rel="tag">Breakfast (2)</a></li>
    <li><a href="archive-r.php?tag=desserts" rel="tag">Desserts (4)</a></li>
    <li><a href="archive-r.php?tag=entrees" rel="tag">Entrees (14)</a></li>
    <li><a href="archive-r.php?tag=salads" rel="tag">Salads (14)</a></li>
    <li><a href="archive-r.php?tag=side-dishes" rel="tag">Side Dishes (8)</a></li>
    <li><a href="archive-r.php?tag=soups" rel="tag">Soups (1)</a></li>
</ul>

现在它是按字母顺序排列的。我需要它来反映以下顺序。

开胃菜 汤
沙拉
主菜 配菜 饮料 甜点





任何帮助是极大的赞赏。

4

1 回答 1

0

有关示例,请参见http://jsfiddle.net/29CGB/3/ 。您需要一个索引来排序,在这种情况下,您已经定义了一个自定义排序。由于 a 标签的 href 是唯一的,我使用它来定义排序。这是代码,请注意我没有将所有项目都添加到数组中:

var sortOrder = ['appetizers', 'soups', 'salads', 'entrees', 'side-dishes']; //make sure to finish this
var newList = $('ul li').sort(function (li1, li2) {
    return sortOrder.indexOf($(li1).find('a').attr('href').replace('archive-r.php?tag=', '')) > sortOrder.indexOf($(li2).find('a').attr('href').replace('archive-r.php?tag=', '')) ?  1 : -1;
});
$('ul').html(newList);
于 2013-08-26T22:41:16.290 回答