此问题与此问题有关,并且基于以下脚本:How does one sort a multi dimensional array by multiple columns in JavaScript?。我的解决方案当时工作(或者我相信),但在对我们的自定义标签进行一系列更改以使其符合跨浏览器标准后,我现在遇到了一个新问题。
所以我有以下代码。我道歉;这是我可以简化它同时仍然复制问题:
<table border=1>
<tr style="font-weight:bold;">
<td>Begin Text</td>
<td>Begin Number</td>
<td>Sorted Text</td>
<td>Sorted Number</td>
</tr>
<tr>
<td id="r1c1"></td>
<td id="r1c2"></td>
<td id="r1c3"></td>
<td id="r1c4"></td>
</tr>
<tr>
<td id="r2c1"></td>
<td id="r2c2"></td>
<td id="r2c3"></td>
<td id="r2c4"></td>
</tr>
<tr>
<td id="r3c1"></td>
<td id="r3c2"></td>
<td id="r3c3"></td>
<td id="r3c4"></td>
</tr>
<tr>
<td id="r4c1"></td>
<td id="r4c2"></td>
<td id="r4c3"></td>
<td id="r4c4"></td>
</tr>
<tr>
<td id="r5c1"></td>
<td id="r5c2"></td>
<td id="r5c3"></td>
<td id="r5c4"></td>
</tr>
<tr>
<td id="r6c1"></td>
<td id="r6c2"></td>
<td id="r6c3"></td>
<td id="r6c4"></td>
</tr>
<tr>
<td id="r7c1"></td>
<td id="r7c2"></td>
<td id="r7c3"></td>
<td id="r7c4"></td>
</tr>
<tr>
<td id="r8c1"></td>
<td id="r8c2"></td>
<td id="r8c3"></td>
<td id="r8c4"></td>
</tr>
<tr>
<td><input type="button" onclick="testSort(1);" value="Sort"></td>
<td><input type="button" onclick="testSort(2);" value="Sort"></td>
</tr>
</table>
<script>
function testSort(orderCol) {
orderList = [orderCol];
dataArr = do2DArraySort(dataArr, orderList, 'desc');
for (x=1; x<=numRows; x++) {
document.getElementById('r' + x + 'c3').innerHTML = dataArr[x-1][1];
document.getElementById('r' + x + 'c4').innerHTML = dataArr[x-1][2];
}
}
function TwoDimensionalArray(iRows, iCols) {
var i;
var j;
var a = new Array(iRows);
for (i=0; i < iRows; i++) {
a[i] = new Array(iCols);
for (j=0; j < iCols; j++) {
a[i][j] = "";
}
}
return(a);
}
function do2DArraySort(dataArr, orderList, orderDir) {
//Loop over each item in the list of sort columns. For each one invoke the sort method on the array using the appropriate function.
for (x=orderList.length-1; x >= 0; x--) {
if (orderDir[x] == 'asc') {
dataArr.sort(sortMethodFunctionAsc);
} else {
dataArr.sort(sortMethodFunctionDesc);
}
}
return dataArr;
}
function checkSortValues(a, b) {
var dataType = 'Text';
if ((IsNumeric(a) && IsNumeric(b)) || (a == null && IsNumeric(b)) || (IsNumeric(a) && b == null)) {
dataType = 'Numeric';
}
if ((IsDate(a) && IsDate(b)) || (a == null && IsDate(b)) || (IsDate(a) && b == null)) {
dataType = 'Date';
}
return dataType;
}
function sortMethodFunctionAsc(a, b) {
if (checkSortValues(a[orderList[x]], b[orderList[x]]) == 'Numeric') {
//If the values are numeric, simply check which is larger than the other.
return a[orderList[x]] - b[orderList[x]];
} else if (checkSortValues(a[orderList[x]], b[orderList[x]]) == 'Date') {
//If the values are dates they need converted to date objects. 95% of the time this is not necessary as they are already passed in as dates,
//but the conversion is required to catch the few cases when they are not.
var a2 = new Date(a[orderList[x]]);
var b2 = new Date(b[orderList[x]]);
//The getTime method is used to convert the dates into millisecond ticker equivalents for easier comparison.
return a2.getTime() - b2.getTime();
} else {
//If one of the values is a string, convert both to a string and compare alphabetically.
if (a[orderList[x]].toString() > b[orderList[x]].toString()) {
return 1;
} else if (a[orderList[x]].toString() < b[orderList[x]].toString()) {
return -1;
} else {
//If they are the same, tell the sort to skip them.
return 0;
}
}
}
function sortMethodFunctionDesc(a, b) {
//This function is identical to the ascending one, but the comparison operators are reversed.
if (checkSortValues(a[orderList[x]], b[orderList[x]]) == 'Numeric') {
return b[orderList[x]] - a[orderList[x]];
} else if (checkSortValues(a[orderList[x]], b[orderList[x]]) == 'Date') {
var a2 = new Date(a[orderList[x]]);
var b2 = new Date(b[orderList[x]]);
return b2.getTime() - a2.getTime();
} else {
if (a[orderList[x]].toString() < b[orderList[x]].toString()) {
return 1;
} else if (a[orderList[x]].toString() > b[orderList[x]].toString()) {
return -1;
} else {
return 0;
}
}
}
function IsNumeric(input) {
return (input - 0) == input && input.length > 0;
}
function IsDate(testValue) {
var returnValue = false;
var testDate;
try {
testDate = new Date(testValue);
if (!isNaN(testDate)) {
returnValue = true;
} else {
returnValue = false;
}
}
catch (e) {
returnValue = false;
}
return returnValue;
}
numRows = 8;
orderList = [1];
dataArr = TwoDimensionalArray(numRows, 2);
dataArr[0][1] = 'Jimbo';
dataArr[0][2] = 3;
dataArr[1][1] = 'Jim';
dataArr[1][2] = 0.65;
dataArr[2][1] = 'Jackie';
dataArr[2][2] = 1.25;
dataArr[3][1] = 'John';
dataArr[3][2] = 0.8;
dataArr[4][1] = 'Jacob';
dataArr[4][2] = 0.95;
dataArr[5][1] = 'Jill';
dataArr[5][2] = 0.85;
dataArr[6][1] = 'Jan';
dataArr[6][2] = 0.8;
dataArr[7][1] = 'Jamie';
dataArr[7][2] = 1.45;
for (x=1; x<=numRows; x++) {
document.getElementById('r' + x + 'c1').innerHTML = dataArr[x-1][1];
document.getElementById('r' + x + 'c2').innerHTML = dataArr[x-1][2];
}
</script>
如果在浏览器中打开它,您将看到一个html表,它按照输入的顺序吐出每个数组列(即:随机)。如果单击列底部的任一按钮,它将对数据进行排序并将其放在第3列和第4列中。我的真实应用程序擦除并重新加载表,但这可用于演示目的。
单击文本列底部的排序按钮可以正常工作;它按字母顺序按名称对数组进行排序。但是,如果对数字列进行排序,您将看到顺序更改,但绝不正确。每次结果都是相同的,但如果您立即单击数字排序或在文本搜索之后(因为搜索基于数组的当前状态而不是原始数组),结果会不同。这正是我在申请中看到的。
我花了一段时间来缩小范围,但这就是我所确定的:
1)文本,日期和整数排序很好;只有小数没有。
2)小数根据第一个数字排序,但忽略小数点后的数据。
3)多列排序工作正常,但显示同样的异常,因此我将其简化为单列排序。
我一直盯着这几个小时,但没有运气,可以用一双新鲜的眼睛。为什么我的array.sort函数无法正常工作?任何想法都将不胜感激。
答案 0 :(得分:1)
您的checkSortValues
函数存在问题,一旦数据类型设置为数字,它也会测试日期为正数。
此外,您的IsNumeric测试中有错误,input.length
将返回undefined。你应该注释掉/改变测试的第二部分。
function IsNumeric(input) {
return (input - 0) == input // && input.length > 0;
}
如果您更改IsNumeric
测试,并且使用else if
代替if
进行日期测试,我认为它可以解决您的问题。
function checkSortValues(a, b) {
var dataType = 'Text';
if ((IsNumeric(a) && IsNumeric(b)) || (a == null && IsNumeric(b)) || (IsNumeric(a) && b == null)) {
dataType = 'Numeric';
}
else if ((IsDate(a) && IsDate(b)) || (a == null && IsDate(b)) || (IsDate(a) && b == null)) {
dataType = 'Date';
}
return dataType;
}
编辑:包含我建议修改的完整代码......
我已对此进行了测试,它对我有用,按正确顺序排序。
<table border=1>
<tr style="font-weight:bold;">
<td>Begin Text</td>
<td>Begin Number</td>
<td>Sorted Text</td>
<td>Sorted Number</td>
</tr>
<tr>
<td id="r1c1"></td>
<td id="r1c2"></td>
<td id="r1c3"></td>
<td id="r1c4"></td>
</tr>
<tr>
<td id="r2c1"></td>
<td id="r2c2"></td>
<td id="r2c3"></td>
<td id="r2c4"></td>
</tr>
<tr>
<td id="r3c1"></td>
<td id="r3c2"></td>
<td id="r3c3"></td>
<td id="r3c4"></td>
</tr>
<tr>
<td id="r4c1"></td>
<td id="r4c2"></td>
<td id="r4c3"></td>
<td id="r4c4"></td>
</tr>
<tr>
<td id="r5c1"></td>
<td id="r5c2"></td>
<td id="r5c3"></td>
<td id="r5c4"></td>
</tr>
<tr>
<td id="r6c1"></td>
<td id="r6c2"></td>
<td id="r6c3"></td>
<td id="r6c4"></td>
</tr>
<tr>
<td id="r7c1"></td>
<td id="r7c2"></td>
<td id="r7c3"></td>
<td id="r7c4"></td>
</tr>
<tr>
<td id="r8c1"></td>
<td id="r8c2"></td>
<td id="r8c3"></td>
<td id="r8c4"></td>
</tr>
<tr>
<td><input type="button" onclick="testSort(1);" value="Sort"></td>
<td><input type="button" onclick="testSort(2);" value="Sort"></td>
</tr>
</table>
<script>
function testSort(orderCol) {
orderList = [orderCol];
dataArr = do2DArraySort(dataArr, orderList, 'desc');
for (x=1; x<=numRows; x++) {
document.getElementById('r' + x + 'c3').innerHTML = dataArr[x-1][1];
document.getElementById('r' + x + 'c4').innerHTML = dataArr[x-1][2];
}
}
function TwoDimensionalArray(iRows, iCols) {
var i;
var j;
var a = new Array(iRows);
for (i=0; i < iRows; i++) {
a[i] = new Array(iCols);
for (j=0; j < iCols; j++) {
a[i][j] = "";
}
}
return(a);
}
function do2DArraySort(dataArr, orderList, orderDir) {
//Loop over each item in the list of sort columns. For each one invoke the sort method on the array using the appropriate function.
for (x=orderList.length-1; x >= 0; x--) {
if (orderDir[x] == 'asc') {
dataArr.sort(sortMethodFunctionAsc);
} else {
dataArr.sort(sortMethodFunctionDesc);
}
}
return dataArr;
}
function checkSortValues(a, b) {
var dataType = 'Text';
if ((IsNumeric(a) && IsNumeric(b)) || (a == null && IsNumeric(b)) || (IsNumeric(a) && b == null)) {
dataType = 'Numeric';
}
else if ((IsDate(a) && IsDate(b)) || (a == null && IsDate(b)) || (IsDate(a) && b == null)) {
dataType = 'Date';
}
return dataType;
}
function sortMethodFunctionAsc(a, b) {
if (checkSortValues(a[orderList[x]], b[orderList[x]]) == 'Numeric') {
//If the values are numeric, simply check which is larger than the other.
return a[orderList[x]] - b[orderList[x]];
} else if (checkSortValues(a[orderList[x]], b[orderList[x]]) == 'Date') {
//If the values are dates they need converted to date objects. 95% of the time this is not necessary as they are already passed in as dates,
//but the conversion is required to catch the few cases when they are not.
var a2 = new Date(a[orderList[x]]);
var b2 = new Date(b[orderList[x]]);
//The getTime method is used to convert the dates into millisecond ticker equivalents for easier comparison.
return a2.getTime() - b2.getTime();
} else {
//If one of the values is a string, convert both to a string and compare alphabetically.
if (a[orderList[x]].toString() > b[orderList[x]].toString()) {
return 1;
} else if (a[orderList[x]].toString() < b[orderList[x]].toString()) {
return -1;
} else {
//If they are the same, tell the sort to skip them.
return 0;
}
}
}
function sortMethodFunctionDesc(a, b) {
//This function is identical to the ascending one, but the comparison operators are reversed.
if (checkSortValues(a[orderList[x]], b[orderList[x]]) == 'Numeric') {
return b[orderList[x]] - a[orderList[x]];
} else if (checkSortValues(a[orderList[x]], b[orderList[x]]) == 'Date') {
var a2 = new Date(a[orderList[x]]);
var b2 = new Date(b[orderList[x]]);
return b2.getTime() - a2.getTime();
} else {
if (a[orderList[x]].toString() < b[orderList[x]].toString()) {
return 1;
} else if (a[orderList[x]].toString() > b[orderList[x]].toString()) {
return -1;
} else {
return 0;
}
}
}
function IsNumeric(input) {
return (input - 0) == input// && input.length > 0;
}
function IsDate(testValue) {
var returnValue = false;
var testDate;
try {
testDate = new Date(testValue);
if (!isNaN(testDate)) {
returnValue = true;
} else {
returnValue = false;
}
}
catch (e) {
returnValue = false;
}
return returnValue;
}
numRows = 8;
orderList = [1];
dataArr = TwoDimensionalArray(numRows, 2);
dataArr[0][1] = 'Jimbo';
dataArr[0][2] = 3;
dataArr[1][1] = 'Jim';
dataArr[1][2] = 0.65;
dataArr[2][1] = 'Jackie';
dataArr[2][2] = 1.25;
dataArr[3][1] = 'John';
dataArr[3][2] = 0.8;
dataArr[4][1] = 'Jacob';
dataArr[4][2] = 0.95;
dataArr[5][1] = 'Jill';
dataArr[5][2] = 0.85;
dataArr[6][1] = 'Jan';
dataArr[6][2] = 0.8;
dataArr[7][1] = 'Jamie';
dataArr[7][2] = 1.45;
for (x=1; x<=numRows; x++) {
document.getElementById('r' + x + 'c1').innerHTML = dataArr[x-1][1];
document.getElementById('r' + x + 'c2').innerHTML = dataArr[x-1][2];
}
</script>
如果您愿意,可以确认here
答案 1 :(得分:1)
我不知道日期,但字符串和数字可以两者按以下方式排序:
if (a < b) {
return 1;
} else if (b > a) {
return -1;
} else {
return
}
<
和>
适用于这两种数据类型。我在您的代码中对此进行了更改,并且工作正常:http://jsfiddle.net/Ft44x/6/我已更改了sortDesc函数。任何其他错误可能是由于你的代码过于复杂而造成的,请将其清理干净!
另外,反过来排序只是:不需要两次实现相同的东西。
function sortAsc() {
... // implement
}
function sortDesc(a, b) {
return -1 * sortAsc(a,b);
}
另外,如果你有一个号码不能将它存储为字符串,那就太傻了。
var my_string = "foo";
var my_number = 42; // no quotes
var my_decimal = 0.63;
还有一件事,如果您需要知道某事是否是日期,为什么不使用instanceof
?
var date = new Date();
alert(date instanceof Date); // should be true
你可以为字符串和数字做同样的事情,但你甚至不需要:P