Juery解決tablesorter中文排序和字元範圍的方法

Juery解決tablesorter中文排序和字元範圍的方法_jquery

WBOY

發布： 2016-05-16 16:00:36

原創

1561 人瀏覽過

本文實例講述了Juery解決tablesorter中文排序和字元範圍的方法。分享給大家供大家參考。具體分析如下：

tablesorter是jQuery插件中比較優秀的一款表格排序插件，我相信大家都使用過或有所耳聞，我在這裡就不過多介紹了，詳細信息可以看看官方網站：http://tablesorter .com/docs/（其中的demo做得比較完整）。

在使用了tablesorter開發的幾個專案中，發現了兩種類型的排序存在問題，如下：

第一個問題是無法對中文字元進行排序，這是因為在字元排序時，是使用的unicode值進行的字元大小比較，代碼如下：

Js代碼

function sortText(a,b) {
  return ((a < b) &#63; -1 : ((a > b) &#63; 1 : 0));
};
function sortTextDesc(a,b) {
  return ((b < a) &#63; -1 : ((b > a) &#63; 1 : 0));
};
function sortText(a,b) {
  return ((a < b) &#63; -1 : ((a > b) &#63; 1 : 0));
};
function sortTextDesc(a,b) {
  return ((b < a) &#63; -1 : ((b > a) &#63; 1 : 0));
};

登入後複製

而我們想要得到的結果是按漢字拼音進行順序進行排序，因此我們將程式碼修改為以下程式碼即可：

Js代碼

function sortText(a,b) {
  return a.localeCompare(b);
};
function sortTextDesc(a,b) {
  return b.localeCompare(a);
};
function sortText(a,b) {
  return a.localeCompare(b);
};
function sortTextDesc(a,b) {
  return b.localeCompare(a);
};

登入後複製

localeCompare方法是JS自帶的方法，不用多說，望文生義就知道這個方法是根據當前區域下對字符的大小進行比較，不過這個方法無法處理多音字。

第二個問題是無法對超出了範圍的數值型資料進行排序，這是因為在進行數值類型轉換時，存在資料值失真的情況，例如：

Js代碼

alert(parseFloat('9999999999999999'));  // 10000000000000000
alert(parseFloat('10000000000000001')); // 10000000000000000
alert(parseFloat('10000000000000004')); // 10000000000000004
alert(parseFloat('10000000000000005')); // 10000000000000004
alert(parseFloat('10000000000000006')); // 10000000000000006
alert(parseFloat('9999999999999999'));  // 10000000000000000
alert(parseFloat('10000000000000001')); // 10000000000000000
alert(parseFloat('10000000000000004')); // 10000000000000004
alert(parseFloat('10000000000000005')); // 10000000000000004
alert(parseFloat('10000000000000006')); // 10000000000000006

登入後複製

這樣的偏差會使得排序結果不準確，為了避免這種問題，應該不使用原始值進行比較，而是應該引入權值，數值從左到右，每一位數值對應的權值遞減，然後根據權值和原始值計算出的新值用於比較，這就只需要修改formatFloat方法就能解決這個問題了。

Js代碼

this.formatFloat = function(s) {    
  // TODO    
  var i = parseFloat(s);    
  return (isNaN(i)) &#63; 0 : i;    
};

登入後複製

希望本文所述對大家的jQuery程式設計有所幫助。