jQuery的數據表排序數字的DIV內容與標題

Question

海蘭傢伙，

我使用此代碼排序自然的列：

-2 
-1 
0 
1 
2 



    function naturalSort(a, b) { 
    var re = /(^-?[0-9]+(\.?[0-9]*)[df]?e?[0-9]?$|^0x[0-9a-f]+$|[0-9]+)/gi, 
     sre = /(^[ ]*|[ ]*$)/g, 
     dre = /(^([\w ]+,?[\w ]+)?[\w ]+,?[\w ]+\d+:\d+(:\d+)?[\w ]?|^\d{1,4}[\/\-]\d{1,4}[\/\-]\d{1,4}|^\w+, \w+ \d+, \d{4})/, 
     hre = /^0x[0-9a-f]+$/i, 
     ore = /^0/, 
    // convert all to strings and trim() 
     x = a.toString().replace(sre, '') || '', 
     y = b.toString().replace(sre, '') || '', 
    // chunk/tokenize 
     xN = x.replace(re, '\0$1\0').replace(/\0$/, '').replace(/^\0/, '').split('\0'), 
     yN = y.replace(re, '\0$1\0').replace(/\0$/, '').replace(/^\0/, '').split('\0'), 
    // numeric, hex or date detection 
     xD = parseInt(x.match(hre)) || (xN.length != 1 && x.match(dre) && Date.parse(x)), 
     yD = parseInt(y.match(hre)) || xD && y.match(dre) && Date.parse(y) || null; 
    // first try and sort Hex codes or Dates 
    if (yD) if (xD < yD) return -1; 
    else if (xD > yD) return 1; 
    // natural sorting through split numeric strings and default strings 
    for (var cLoc = 0, numS = Math.max(xN.length, yN.length); cLoc < numS; cLoc++) { 
     // find floats not starting with '0', string or 0 if not defined (Clint Priest) 
     oFxNcL = !(xN[cLoc] || '').match(ore) && parseFloat(xN[cLoc]) || xN[cLoc] || 0; 
     oFyNcL = !(yN[cLoc] || '').match(ore) && parseFloat(yN[cLoc]) || yN[cLoc] || 0; 
     // handle numeric vs string comparison - number < string - (Kyle Adams) 
     if (isNaN(oFxNcL) !== isNaN(oFyNcL)) return (isNaN(oFxNcL)) ? 1 : -1; 
     // rely on string comparison if different types - i.e. '02' < 2 != '02' < '2' 
     else if (typeof oFxNcL !== typeof oFyNcL) { 
      oFxNcL += ''; 
      oFyNcL += ''; 
     } 
     if (oFxNcL < oFyNcL) return -1; 
     if (oFxNcL > oFyNcL) return 1; 
    } 
    return 0; 
}; 
// Natural Sorting 
jQuery.fn.dataTableExt.oSort['natural-asc'] = function (a, b) { 
    return naturalSort(a, b); 
}; 
jQuery.fn.dataTableExt.oSort['natural-desc'] = function (a, b) { 
    return naturalSort(a, b) * -1; 
}; 

它工作正常，但如果我把一個DIV與標題爲內容在數字之前，它不能正常工作：

<div title='juhu'>-1</div > 
<div title='juhu'>-2</div > 
<div title='juhu'>0</div > 
<div title='juhu'>1</div > 
<div title='juhu'>2</div > 

有沒有人有解決這個問題的方法？

Answer 1

它有助於在您的Javascript中使用console.log。如果您記錄xN和yN數字，您會看到正數字如下所示：<div title="juhu">,1,</div>但負數字看起來像這樣<div title="juhu">-,2,</div>。

當您遍歷標記化的字符串時，當您比較正數到負數時，第一個比較將比較<div title="juhu">和<div title="juhu">-。它會將它們作爲純ASCII進行比較，因此在「asciibetical」順序中，<div title="juhu">小於<div title="juhu">-。

你naturalSort函數的頂部添加此：

function naturalSort(a, b) { 
a = typeof a.replace == 'function' ? 
     a.replace(/<[\s\S]*?>/g, "") : a; 
    b = typeof a.replace == 'function' ? 
     b.replace(/<[\s\S]*?>/g, "") : b; 

這將去掉HTML標記，並應解決您的問題。

數據表是優秀的，往往就會有你需要建在什麼看這個頁面，它可以幫助：http://www.datatables.net/plug-ins/type-detection

我上面使用的代碼來自於「數字與HTML」部分。