簡體   English   中英

如何通過單擊 Jquery 中的標題對表列進行排序?

[英]How to sort a table column by clicking on the header in Jquery?

我想通過單擊表標題對表列字符串值進行排序。 在這里我做了字母排序。 請將此代碼更改為字符串列排序。

enter code here
  var  sortOrder = -1;
    $(".sort").click(function () {
        sortOrder *= -1;
     sortTable($(this));
     });


  function sortTable(element) {
    var tbody = element.parent();
    var colIndex = element.index() -1;
    tbody.find('tr').sort(function (a, b)
    {
        $('td', a).eq(colIndex).text() === "" ? $('td', a).eq(colIndex).text("0") :   $('td', a).eq(colIndex).text();
        if (sortOrder === 1)
        {
            return parseInt($('td', a).eq(colIndex).text(), 10) - parseInt($('td', b).eq(colIndex).text(), 10);
        }
        else
        {
            return parseInt($('td', b).eq(colIndex).text(), 10) - parseInt($('td', a).eq(colIndex).text(), 10);
        }

    }).appendTo(tbody);
    tbody.find('tr').each(function () {
        $(this).removeClass();
        zebra = zebra === 'odd' ? 'even' : 'odd';
        $(this).addClass(zebra);
        $(this).find("td").eq(colIndex).text() === 0 ? $(this).find("td").eq(colIndex).text(""):$(this).find("td").eq(colIndex).text(); 
    });
}

在那里使用 jquery 數據表 js,您將獲得默認的排序選項,您還可以使用更多選項,稱為過濾器、分頁等...參考

$(document).ready(function(){
    $('#myTable').DataTable();
});

這是一個用於對表格進行排序的 jQuery 插件: http : //tablesorter.com/

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM