Question

我在PHP中有一个复杂的系统，如果我在PHP中使用它，我需要通过10个不同的表来运行它，这非常令人讨厌。

现在我找到了一个自定义jQuery排序的解决方案，但是找不到任何有用的例子来让它按照我的方式工作。

我目前有一个应该对类型进行排序的链接（asc | desc）

我的条目循环目前是

<tr class="lol" onclick="location.href='<?=$productlink?>'" style="cursor:pointer">
<td style="width:250px;border-bottom:1px solid #eee"><?=$fullPath?></td>
<td style="width:250px;border-bottom:1px solid #eee">

    <!-- sortable -->
       <span class="hiddenPrice">25,000</span>
       <span class="hiddenKilometers">10,000</span>
       <span class="hiddenYear">1982</span>
       <span class="hiddenMake">Ford</span>
    <!-- /sortable -->

    <strong style="font-size:15px"><?=$row['varenavn1']?></strong><br>
    <em>Pris: <?=number_format($row['salgspris']);?> kr.</em>
    <p><?=substr(strip_tags($row['lang_varebeskrivelse']), 0, 150)?>...</p>

    <a href="<?=$productlink?>" class="greenButton" style="color:#fff">SE MERE</a><br>
</td>

我在span的内部有不同的值。但我怎么能通过排序。链接到那些值？

希望有人可以帮助我。

Answer 1

你应该能够用这2个小提琴解决这个问题（其中我不是作者）：

按字符串排序：http://jsfiddle.net/stodolaj/De8Ku/

    function sortUnorderedList(ul, sortDescending) {
      if(typeof ul == "string")
        ul = document.getElementById(ul);

      var lis = ul.getElementsByTagName("LI");
      var vals = [];

      for(var i = 0, l = lis.length; i < l; i++)
        vals.push(lis[i].innerHTML);

      vals.sort();

      if(sortDescending)
        vals.reverse();

      for(var i = 0, l = lis.length; i < l; i++)
        lis[i].innerHTML = vals[i];
    }

    window.onload = function() {
      var desc = false;
      document.getElementById("test").onclick = function() {
        sortUnorderedList("list", desc);
        desc = !desc;
        return false;
      }
    }

按编号排序：http://jsfiddle.net/7y9MA/3/

var ascending = false;

$('.tab-content').on('click','.sortByPrice',function(){

    var sorted = $('.results-row').sort(function(a,b){
        return (ascending ==
               (convertToNumber($(a).find('.price').html()) < 
                convertToNumber($(b).find('.price').html()))) ? 1 : -1;
    });
    ascending = ascending ? false : true;

    $('.results').html(sorted);
});

var convertToNumber = function(value){
     return parseFloat(value.replace('$',''));
}

Answer 2

将所有内容放入div

 <div id ="sample">
   <span  type="spSort" class="hiddenPrice">25,000</span>
    <span  type="spSort" class="hiddenKilometers">10,000</span>
     <span  type="spSort" class="hiddenYear">1982</span>
    <span  type="spSort" class="hiddenMake">Ford</span>
</div>

这是脚本：

$(document).ready(function(){
   var new htmlString ="";
var list = [];
   var count= 0;

  //add all span to list
  $("#sample").find('span').each(function(){
   list[count] = $(this);
   count++;
};

 //sort by bubble sort




 for (var i = 0; i < list.length; i++) {


    for (var j = 0, swapping, endIndex = list.length- i; j < endIndex; j++) {


        if (list[j].html() > list[j + 1].html()) {

            swapping = list[j];

            list[j] = list[j + 1];
            list[j + 1] = swapping;

        };
    };
}

// add to htmlString
for(var i=0; i<list.length ; i++){
  htmlString += list[i];
}
// set again to div
  $("#sample").html(htmlString);
});

jQuery自定义排序？

2 个答案: