2013-02-06 29 views
1

排序標籤我有這樣的HTML與屬性

<td colspan="4" class="item"> DERBY LINE, VT 05830<br> 
    <label for="" data-sort="16.26">UPS Ground $16.26</label><br> 
    <label for="" data-sort="27.57">UPS 3 Day Select&reg; $27.57</label><br> 
    <label for="" data-sort="33.87">UPS 2nd Day Air&reg; $33.87</label><br> 
    <label for="" data-sort="72.82">UPS Next Day Air $72.82</label><br> 
    <label for="" data-sort="7.99">USPS Priority $7.99</label><br> 
    <label for="" data-sort="9.61">FEDEX SmartPost&reg; FedEx Delivered Via USPS $9.61</label><br> 
    &nbsp; 
    <input type="button" name="Button5" id="Button5" onmouseout="this.className='btn'" onmouseover="this.className='btn_over'" onclick="document.shipquote.action='shipquote.asp?action=clean';document.shipquote.submit();" value="Clear" class="btn"> 
</td> 

,我需要它的「數據排序」屬性是排序,現在我使用 this element sorter 但是當我運行的腳本它返回這個

<td colspan="4" class="item"> DERBY LINE, VT 05830<br> 
    <label for="" data-sort="16.26">UPS Ground $16.26</label><br> 
    <label for="" data-sort="27.57">UPS 3 Day Select&reg; $27.57</label><br> 
    <label for="" data-sort="33.87">UPS 2nd Day Air&reg; $33.87</label><br> 
    <label for="" data-sort="7.99">USPS Priority $7.99</label><br> 
    <label for="" data-sort="72.82">UPS Next Day Air $72.82</label><br> 
    <label for="" data-sort="9.61">FEDEX SmartPost&reg; FedEx Delivered Via USPS $9.61</label><br> 
    &nbsp; 
    <input type="button" name="Button5" id="Button5" onmouseout="this.className='btn'" onmouseover="this.className='btn_over'" onclick="document.shipquote.action='shipquote.asp?action=clean';document.shipquote.submit();" value="Clear" class="btn"> 
</td> 

你可以看到它運行,但由於某種原因,它只得到attr的第一個數字。我正在使用的呼叫如下:

$('.item label').sortElements(function(a, b){ 
    return $(a).attr("data-sort") > $(b).attr("data-sort") ? 1 : -1; 
});  

我在做什麼錯?

回答

5

看起來它目前將每個值視爲一個字符串,並按照相應的順序1-9對它們進行排序。您應該使用parseFloat()將字符串中的值轉換爲浮點數,以確保正確地完成比較:

$('.item label').sortElements(function(a, b){ 
    return parseFloat($(a).attr("data-sort")) > parseFloat($(b).attr("data-sort")) ? 1 : -1; 
}); 

或者使用.data()方法來代替,這將自動解釋這些數字作爲花車:

$('.item label').sortElements(function(a, b){ 
    return $(a).data("sort") > $(b).data("sort") ? 1 : -1; 
}); 
+0

你是對的,它比較字符串:' 「23」> 「3」 ===假', –

+0

感謝你們所有人,這兩個解決方案工作.. –

+0

@ Blazemonger - 我沒有閱讀'.data()'緊密,但它確實試圖解釋數據類型。 「每一次嘗試都會將字符串轉換爲JavaScript值(這包括布爾值,數字,對象,數組和空值),否則會將其保留爲字符串。」真棒,感謝信息=) – Chase