jQuery - 排序李

Question

我不知道爲什麼，但這段代碼沒有正確排序我的李。他們正在改變順序，但是例如，如果它們是這樣的1,5，2,9然後將其改變到5，2,9，1。

jQuery代碼：

var sorter_type=new Array("date_sort","price_sort","discount_sort","time_sort"); 
function sorting_by_filter(filter_id,field) 
{ 
    var sort_type=""; 

    if($('#'+filter_id).attr("class")=="asc") 
    { 
     $('#'+filter_id).removeClass("asc"); 
     $('#'+filter_id).addClass("desc"); 
     sort_type=" desending"; 
    } 
    else 
    { 
     $('#'+filter_id).removeClass("desc"); 
     $('#'+filter_id).addClass("asc"); 
     sort_type=""; 
    } 

    for(i=0;i<sorter_type.length;i++) 
    { 
     if(sorter_type[i]==filter_id) 
     { 
      $('#'+filter_id).parent().attr("class",""); 
      $('#'+filter_id).parent().addClass("clsTop_Menu_Act"+sort_type); 
     } 
     else 
     { 
      $("#"+sorter_type[i]).parent().attr("class",""); 
     } 

    } 

    var $sort = $('#'+filter_id); 

    var $list = $('.clsDeal_Whole_Cont'); 
    var $listLi = $('li.clsDeal_Blk_Cont',$list); 
    $listLi.sort(function(a, b){ 
     var keyA = parseInt($(a).attr(field)); 
     var keyB = parseInt($(b).attr(field)); 
     if($($sort).hasClass('asc')){ 
      return (keyA > keyB) ? 1 : 0; 
     } else { 
      return (keyA < keyB) ? 1 : 0; 
     } 
    }); 
    $.each($listLi, function(index, row){ 
     $list.append(row); 
    }); 
} 

按鈕的代碼：這就需要

 <ul class="clearfix" id="filters"> 
     <li class="clsTop_Menu_Act"><a href="javascript:void(0)" class="asc"  onclick="sorting_by_filter('date_sort','title')" id="date_sort">New</a></li> 
      <li><a href="javascript:void(0)" onclick="sorting_by_filter('price_sort','price')" class="asc" id="price_sort">Price</a></li> 
      <li><a href="javascript:void(0)" onclick="sorting_by_filter('discount_sort','discount')" class="asc" id="discount_sort">Discount</a></li> 
      <li><a href="javascript:void(0)" onclick="sorting_by_filter('time_sort','time_left')" class="asc" id="time_sort" >Time Left</a></li> 
</ul> 

內容進行排序：

<ul class="clsDeal_Whole_Cont clearfix"> 
    <li class="clsDeal_Blk_Cont" style="display:block" id="deal_1" price="2" discount="50" time_left="1360363800"> 
    <li class="clsDeal_Blk_Cont" style="display:block" id="deal_10" price="20" discount="45" time_left="1360363700"> 
    <li class="clsDeal_Blk_Cont" style="display:block" id="deal_5" price="19" discount="80" time_left="1360363800"> 
</ul> 

Answer 1

也許因爲你永遠不返回-1從你的排序回調。總是隻有1或0，順便說一句，你沒有正確返回。

如果您在上升順序排序，那麼你必須返回-1（負數），如果keyA小於keyB，0如果它們相等或+1（正數），如果keyA比keyB大。

例子：

$listLi.sort(function(a, b){ 
    var keyA = parseInt($(a).attr(field), 10); 
    var keyB = parseInt($(b).attr(field), 10); 

    // sorts in descending order. The result will be 
    // negative if keyA > keyB 
    // 0  if keyA == keyB 
    // positive if keyA < keyB 

    var result = keyB - keyA; 
    if ($sort.hasClass('asc') { 
     // multiplying by -1 reverses the order 
     result = result * (-1); 
    } 
    return result; 
}); 

通過閱讀Array#sort documentation瞭解更多關於排序回調。

Answer 2

正如Felix Kling指出的那樣，您的排序功能還沒有達到要求。這些都是有效的種類必須處理的條件下，從MDN documentation：

• 如果compareFunction(a, b)小於0，排序一個比B A較低折射率。
• 如果compareFunction(a, b)返回0，則相對於彼此保持a和b不變，但相對於所有不同的元素進行排序。注意：ECMAscript標準並不保證這種行爲，因此並非所有瀏覽器（例如，至少可以追溯到2003年的Mozilla版本）都尊重這一點。
• 如果compareFunction(a, b)大於0，則將b排序爲比a更低的索引。
• compareFunction(a, b)當給定一對特定元素a和b作爲其兩個參數時，必須始終返回相同的值。如果不一致的結果返回則排序順序是未定義

他已經張貼了工作排序功能（和1'uped我的文檔鏈接），所以我就點你到一個jQuery UI插件錄取工作出於未來的實施：jQuery UI Sortable。