内容载入中...
支持原创支持教程中国 华腾联合.中国
最近在做项目过程中遇到这样一个疑问：（查看实例代码TEST1）
DHTML中table对象的moveRow方法实现对table中表格行移动到新位置。例子TEST1中行2包含文本框、复选框、下拉框，当分别键入值后对行2执行上移操作后，我们发现，文本框与下拉框的值不会丢失，但复选框值会丢失。而如果在行2中键入值后对行1执行下移操作，这时候所有值都不会丢失。这也就说明了moveRow方法对所操作行中复选框的值无法保存。
这显然是ie存在的一个bug，虽然baidu到相同的提问，但是都没有最终的答案。幸运的是在google里找到了一份英文文档HTML控件，将所有checkbox的对象及其对应值添加到数组中（数组的push方法：将新元素添加到一个数组中，并返回数组的新长度值），在执行moveRow后对数组中所有元素获得checkbox对象对其赋值，该值为保存在数组的值，保证了值不丢失（数组的shift方法：移除数组中的第一个元素并返回该元素）。（查看实例代码TEST2）
//上移
function moveUp()
{
var myTable;
var Elm=event.srcElement;
while(Elm&&Elm.tagName!="TR"){
Elm=Elm.parentElement;
}
x = Elm.rowIndex;
myTable = Elm.parentElement;
//移到上一行
if (x > 0)
{
moveCell(myTable, x, x-1);
}
}
//下移
function moveDown()
{
var myTable;
var Elm=event.srcElement;
while(Elm&&Elm.tagName!="TR"){
Elm=Elm.parentElement;
}
x = Elm.rowIndex;
myTable = Elm.parentElement;
//移到下一行
if (x < myTable.rows.length - 1)
{
moveCell(myTable, x, x+1);
}
}
//移动行，参数：要操作的table，要相互移动的行a，b
function moveCell(myTable, a, b)
{
var el = myTable.all.tags("input")
var arr = [];
//遍历所有input控件
for(i = 0; i < el.length; i++)
{
if(el[i].type == "checkbox")
//对所有checkbox控件添加到数组中
arr.push(el[i], el[i].checked);
}
myTable.moveRow(a, b);
//对数组中所有元素获得对象并对引用的对象赋原值
while(arr.length > 0)
arr.shift().checked = arr.shift();
}
这个问题也同样在单选框radio button中存在。
PS：个人以为这种方式很好地解决了ie的bug引出的这个问题，所以将帖子放到首页，不知道合不合适，因为这个问题在国内的论坛中没发现提出解决方案的，所以希望对大家碰到类似问题有所帮助，任何见解一起讨论！如果放首页不合适，请dudu及时通知本人，谢谢！
附件：
document.getElementById('loading').style.display="none";
