假设有一个二维数组,要对这个数组中的第一列数据和第2列数据分别按照某种顺序进行排序。
var createMarketSentimenHtml = function(dataObj) { var dData=dataObj.data.sort(getDataSortBy); var marketSentimentTable = "<table id='msMarketSentiment'><thead><tr><td class='algn_lt'>Issue Type</td><td class='algn_lt'></td><td class='algn_rt'>Total # of Transactions</td><td class='algn_rt'>Total Securities Traded</td><td class='algn_rt'>Total Volume ($ Par)</td></tr></thead><tbody>"; var marketSentimentTr = ""; for (var i = 0, len = dData.length; i < len; i++) { var objRow = dData[i]; for (var r in objRow) { var rowKey = r; var rowValue = objRow[r] + ""; rowValue=getDataFormat(rowValue); if (rowValue.indexOf(":") > 0) { var rowdata = rowValue.split(":"); marketSentimentTr += "<tr><td class='algn_lt'>" + rowdata[0] + "</td><td class='algn_lt'>" + rowdata[1] + "</td>"; } else { marketSentimentTr += "<td class='algn_rt'>" + rowValue + "</td>"; } } marketSentimentTr += "</tr>"; } marketSentimentTr += "</tbody></table>"; marketSentimentTable +=marketSentimentTr; return marketSentimentTable; }; var getDataFormat=function(dataValue){ var nDataValue = dataValue; if(!isNaN(dataValue)){ if (/^(+|-)?(d+)(.d+)?$/.test(dataValue)) { var a = RegExp.$1, b = RegExp.$2, c = RegExp.$3; var re = new RegExp(); re.compile("(\d)(\d{3})(,|$)"); while (re.test(b)) { b = b.replace(re, "$1,$2$3"); } } nDataValue=(a + "" + b + "" + c); } if(dataValue==="null"){ nDataValue="--"; } return nDataValue; }; var getDataSortBy=function(data0,data1){ var Rankdata0=getDataRank(data0); var Rankdata1=getDataRank(data1); if(Rankdata0<Rankdata1){ return -1; }else if(Rankdata0==Rankdata1){ return 0; }else{ return 1; } }; var getDataRank =function(data){ var descData=data["Desc"]; var descDataArr; if (descData.indexOf(":") > 0) { descDataArr = descData.split(":"); } var filter=FinraQS.filterKey; if(filter=="A"){ columnArr1=["All Securities","Fannie Mae","FHLB","Freddie Mac"]; columnArr2=["All Securities","Customer Buy","Customer Sell","Affiliate Buy","Affiliate Sell","Inter-Dealer"]; }else{ columnArr1=["All Securities","Investment Grade","High Yield","Convertable Bonds","Church Bonds","Equity Linked Note"]; columnArr2=["All Securities","Customer Buy","Customer Sell","Affiliate Buy","Affiliate Sell","Inter-Dealer"]; } var index_0=$.inArray(descDataArr[0].replace(/(^s*)|(s*$)/g, ""),columnArr1); var index_1=$.inArray(descDataArr[1].replace(/(^s*)|(s*$)/g, ""),columnArr2); if(index_0==-1){ index_0=columnArr1.length+1; } if(index_1==-1){ index_1=columnArr2.length+1; } var index=index_0+"."+index_1; return index; };
主要是使用js的sort()方法进行排序,定义了排序规则getDataSortBy().思想就是:首先在getDataRank()方法中将这个二维数组中第一列和第二列的中的元素分别与标准数组进行比较,按照元素在标准数组中的位置做上标记,转为0.0,0.1,1.3等格式,然后再使用getDataSortBy()进行排序。
如何对一个HTML格式的table中的第一列和第二列进行排序呢?
var createMarketSentimenHtml = function(dataObj) { var marketSentimentTable = "<table id='msMarketSentiment'><thead><tr><td class='algn_lt'>Issue Type</td><td class='algn_lt'></td><td class='algn_rt'>Total # of Transactions</td><td class='algn_rt'>Total Securities Traded</td><td class='algn_rt'>Total Volume ($ Par)</td></tr></thead><tbody>"; var marketSentimentTr = ""; var dData = dataObj; for (var i = 0, len = dData.data.length; i < len; i++) { var objRow = dData.data[i]; for (var r in objRow) { var rowKey = r; var rowValue = objRow[r] + ""; rowValue=getDataFormat(rowValue); if (rowValue.indexOf(":") > 0) { var rowdata = rowValue.split(":"); marketSentimentTr += "<tr><td class='algn_lt'>" + rowdata[0] + "</td><td class='algn_lt'>" + rowdata[1] + "</td>"; } else { marketSentimentTr += "<td class='algn_rt'>" + rowValue + "</td>"; } } marketSentimentTr += "</tr>"; } marketSentimentTr += "</tbody></table>"; var sentimentTable=marketSentimentTable + marketSentimentTr; var colDataArr=getDataFromHtml(sentimentTable); colDataArr.sort(getDataSortby); var trHtml=""; for(var k=0,len=colDataArr.length;k<len;k++){ trHtml+="<tr>"+colDataArr[k].innerHTML+"</tr>"; } marketSentimentTable +=trHtml; return marketSentimentTable; }; var getDataFormat=function(dataValue){ var nDataValue = dataValue; if(!isNaN(dataValue)){ if (/^(+|-)?(d+)(.d+)?$/.test(dataValue)) { var a = RegExp.$1, b = RegExp.$2, c = RegExp.$3; var re = new RegExp(); re.compile("(\d)(\d{3})(,|$)"); while (re.test(b)) { b = b.replace(re, "$1,$2$3"); } } nDataValue=(a + "" + b + "" + c); } if(dataValue==="null"){ nDataValue="--"; } return nDataValue; }; var getDataSortby =function(trArr_a,trArr_b){ var columnArr1,columnArr2; var filter=FinraQS.filterKey; if(filter=="A"){ columnArr1=["All Securities","Fannie Mae","FHLB","Freddie Mac"]; columnArr2=["All Securities","Customer Buy","Customer Sell","Affiliate Buy","Affiliate Sell","Inter-Dealer"]; }else{ columnArr1=["All Securities","Investment Grade","High Yield","Convertable Bonds","Church Bonds","Equity Linked Note"]; columnArr2=["All Securities","Customer Buy","Customer Sell","Affiliate Buy","Affiliate Sell","Inter-Dealer"]; } var trArrContent_a=$($(trArr_a).find("td")[0]).text().replace(/(^s*)|(s*$)/g, ""); var trArrContent_b=$($(trArr_b).find("td")[0]).text().replace(/(^s*)|(s*$)/g, ""); var sortFlag=sortArr(trArrContent_a,trArrContent_b,columnArr1); if(sortFlag==0){ var trArrContent_a1=$($(trArr_a).find("td")[1]).text().replace(/(^s*)|(s*$)/g, ""); var trArrContent_b1=$($(trArr_b).find("td")[1]).text().replace(/(^s*)|(s*$)/g, ""); var sortFlag_1=sortArr(trArrContent_a1,trArrContent_b1,columnArr2); } return (sortFlag!=0)?sortFlag:sortFlag_1; }; var sortArr=function(th_a,th_b,columnArr){ var aIndex,bIndex; var len=columnArr.length; for(var i=0;i<len;i++){ if(columnArr[i]==th_a){ aIndex=i; break; } } for(var j=0;j<len;j++){ if(columnArr[j]==th_b){ bIndex=j; break; } } return (aIndex-bIndex); }; var getDataFromHtml=function(htmlString){ var rowTrObj=$(htmlString).find("tbody tr"); var DataValueArr=[]; for(var item in rowTrObj){ if(!isNaN(item)&& rowTrObj.hasOwnProperty(item)){ DataValueArr.push(rowTrObj[item]); } } return DataValueArr; };
以上代码就比第一个要复杂,首先要把String类型的html转为为数组。第二种方法过于复杂,性能也不好,不推荐使用,但是可以对二维排序起一个启示作用。
以上代码是我在项目中实际使用的,有些变量之类的可能不清楚,主要是看排序的思想。