按指定條件對頁面上的項目進行排序

Question

我希望能夠按照不同的標準（例如：按價格和名稱）對我的網頁上的內容進行排序。

我想結果是正是這一點：http://www.pccasegear.com/index.php?main_page=index&cPath=7

我使用靜態的HTML，項目列表不會被調用以任何方式的頁面，我不希望o使用的數據庫任何一種。

我將使用將是類似這樣的代碼：

<div class="product"> 
    <div class="name"> 
    <p>Product 1</p> 
    </div> 
    <div class="price"> 
    <p>$1.00</p> 
    </div> 
</div> 

Answer 1

通過price

$('div.price').map(function() { 
    return {val: parseFloat($(this).text(), 10), el: this.parentNode}; 
}).sort(function (a, b) { 
    return a.val - b.val; 
}).map(function() { 
    return this.el; 
}).appendTo('body'); 

演示嘗試使用此方法sortSort by price

一些modification後就可以sort它由name也很喜歡，

$('div.name').map(function() { 
    return {val: $.trim($(this).text()), el: this.parentNode}; 
}).sort(function (a, b) { 
    return a.val > b.val; 
}).map(function() { 
    return this.el; 
}).appendTo('body'); 

演示Sort by name