表格排序遇到的问题!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! 代码就不看了,要是表格排序的话,我一般都用jQuery的插件来解决,推荐TableSorterlz去看看,了解一下 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 <script Language = "javascript"> function compareTRs(oTR1,oTR2) { var sValue1 = oTR1.cells[0].firstChild.nodeValue; var sValue2 = oTR2.cells[0].firstChild.nodeValue; return sValue1.localeCompare(sValue2); } function sortTable(sTableID) { var oTable = document.getElementById(sTableID); var oTBody = oTable.tBodies[0]; var colDataRows = oTBody.rows; var aTRs = new Array; for(var i=0; i<colDataRows.length; i++) { aTRs.push(colDataRows[i]); } aTRs.sort(compareTRs); var oFragment = document.createDocumentFragment(); for(var i=0; i<aTRs.length; i++) { oFragment.appendChild(aTRs[i]); } var oTable1= document.getElementById("test"); var oTBody1 = oTable1.tBodies[0]; var oFragment2 = oFragment.cloneNode(true);//文档碎片不能重复用 oTBody.appendChild(oFragment); oTBody1.appendChild(oFragment2); }</script><table width="100" border="1" id="tblSort"> <thead> <tr> <td>标题</td> </tr> </thead> <tbody> <tr> <td>ac</td> </tr> <tr> <td>d</td> </tr> <tr> <td>c</td> </tr> <tr> <td>b</td> </tr> <tr> <td>ab</td> </tr> <tbody></table><hr/><table width="100" border="1" id="test"><thead> <tr> <td>1</td> </tr></thead> <tbody> <tr> <td>2</td> </tr> <tr> <td>3</td> </tr> <tr> <td>4</td> </tr> <tr> <td>5</td> </tr> </tbody></table><input type=button value=test onclick="sortTable('tblSort')"/> 谢谢二楼的朋友:还有一点我不是太明白了,就是第一个表格当中的<tbody>中有四个<tr>,最后我们又在<tbody>中用fragment新增加了四行,一共八个<tr>才对,怎么最后还是四个<tr>啊?为什么啊? 那是因为你第一个表格的数据 排序后 还是第一个表格的那些数据 所以appendChild遇到相同数据 它不增加只覆盖了 <script language="javascript"> function qq() { var oTable = document.getElementById("table1"); var oBody = oTable.tBodies[0]; var oTr = document.createElement("<tr>"); var oTd = document.createElement("<td>"); var oText = document.createTextNode("测试"); oTd.appendChild(oText); oTr.appendChild(oTd); for(var i=0; i< 11; i++) { oBody.appendChild(oTr); } }</script><table width="100" border="1" id="table1"><thead> <tr> <td> </td> </tr></thead><tbody> <tr> <td>a</td> </tr> <tr> <td>b</td> </tr> <tr> <td>c</td> </tr> <tr> <td>d</td> </tr></tbody></table><input type="button" value="test" onClick="qq()"/> ExtJS单选按钮怎么使用??? [这个能实现吗?]onclick某个 图片后 触发另一个 对象的onclick 问一个关于jquery与ie6的问题 如何在javascrip中调用webservice 请教高手一个javascript的基础问题 dom是什么,以前怎么没有听说过啊 怎么用js写个切换图片的代码 谁能叫这个例子正常运行呵 大家好,问一下关于打印和关闭窗口的IE功能! 小白提问:关于JSP文件放置的问题 请教字符串的长度 求进入某页面需要输入用户名和密码的代码
<script Language = "javascript">
function compareTRs(oTR1,oTR2)
{
var sValue1 = oTR1.cells[0].firstChild.nodeValue;
var sValue2 = oTR2.cells[0].firstChild.nodeValue;
return sValue1.localeCompare(sValue2);
}
function sortTable(sTableID)
{
var oTable = document.getElementById(sTableID);
var oTBody = oTable.tBodies[0];
var colDataRows = oTBody.rows;
var aTRs = new Array;
for(var i=0; i<colDataRows.length; i++)
{
aTRs.push(colDataRows[i]);
}
aTRs.sort(compareTRs);
var oFragment = document.createDocumentFragment();
for(var i=0; i<aTRs.length; i++)
{
oFragment.appendChild(aTRs[i]);
}
var oTable1= document.getElementById("test");
var oTBody1 = oTable1.tBodies[0];
var oFragment2 = oFragment.cloneNode(true);//文档碎片不能重复用
oTBody.appendChild(oFragment);
oTBody1.appendChild(oFragment2);
}
</script>
<table width="100" border="1" id="tblSort">
<thead>
<tr>
<td>标题</td>
</tr>
</thead>
<tbody>
<tr>
<td>ac</td>
</tr>
<tr>
<td>d</td>
</tr>
<tr>
<td>c</td>
</tr>
<tr>
<td>b</td>
</tr>
<tr>
<td>ab</td>
</tr>
<tbody>
</table>
<hr/>
<table width="100" border="1" id="test">
<thead>
<tr>
<td>1</td>
</tr>
</thead>
<tbody>
<tr>
<td>2</td>
</tr>
<tr>
<td>3</td>
</tr>
<tr>
<td>4</td>
</tr>
<tr>
<td>5</td>
</tr>
</tbody></table>
<input type=button value=test onclick="sortTable('tblSort')"/>
还有一点我不是太明白了,就是第一个表格当中的<tbody>中有四个<tr>,最后我们又在<tbody>中用fragment新增加了
四行,一共八个<tr>才对,怎么最后还是四个<tr>啊?为什么啊?
function qq()
{
var oTable = document.getElementById("table1");
var oBody = oTable.tBodies[0];
var oTr = document.createElement("<tr>");
var oTd = document.createElement("<td>");
var oText = document.createTextNode("测试");
oTd.appendChild(oText);
oTr.appendChild(oTd);
for(var i=0; i< 11; i++)
{
oBody.appendChild(oTr);
}
}</script>
<table width="100" border="1" id="table1">
<thead>
<tr>
<td> </td>
</tr>
</thead>
<tbody>
<tr>
<td>a</td>
</tr>
<tr>
<td>b</td>
</tr>
<tr>
<td>c</td>
</tr>
<tr>
<td>d</td>
</tr>
</tbody>
</table>
<input type="button" value="test" onClick="qq()"/>