qfdyitian 发表于 2013-1-29 08:41:41

js 操作table

最近把系统前台页面做点功能优化,好几年没写过js了,头顿时很大,经过一系列狂整,总算给做出来了。


      //删除行
function deleteCurrentRow(obj){

   if(confirm("确实要删除吗?")) {

var tr=obj.parentNode.parentNode;
var tbody=tr.parentNode;
tbody.removeChild(tr);
       }else{

       }
}



table 行上移下移

//上移
function moveUp(src)
{   
//上移一行      
var rowIndex=src.parentElement.parentElement.rowIndex;
if (rowIndex>=2)
    change_row(rowIndex-1,rowIndex);      
}

function moveDown(src){
//下移一行
var rowIndex=src.parentElement.parentElement.rowIndex;
var tl = document.getElementById("categoryTable");
if (rowIndex<tl.rows.length-1){
    change_row(rowIndex+1,rowIndex);
}

}
function change_row(line1,line2)
{
//执行交换
categoryTable.rows.swapNode(categoryTable.rows);
}



//删除table所有行
function delAllMyRow(){
   var mytable = document.getElementById("mybody");
   var rowlen=mytable.rows.length;
   for(var i=rowlen-1;i>=0;i--){
         mytable.deleteRow(i);
   }
}



往table 里面插入一行

function selectedChargePackage(value) {

var tab = window.parent.frames.frame1.document.getElementById("categoryTable") ;
//表格行数
   var rows = tab.rows.length ;

//添加一行
   var newTr =window.parent.frames.frame1.document.getElementById("mybody").insertRow();

      //表格列数
    // var cells = tab.rows.item(0).cells.length ;
    // alert("行数"+rows+"列数"+cells);
   
   //添加四列
   var newTd0 = newTr.insertCell();
   var newTd1 = newTr.insertCell();
   var newTd2 = newTr.insertCell();
   var newTd3 = newTr.insertCell();
   
      
   //设置列内容和属性
   newTd0.innerHTML= rows;
   newTd1.innerHTML= idValue + tempArray + ",";
   newTd2.innerHTML= nameValue + tempArray + ",";
   newTd3.innerHTML ="<a href='#' onclick='moveUp(this)' cellpadding='3' cellspacing='1' bgcolor='#c7dffc' style='margin-top:5px; margin-bottom:5px;'>上移</a> " +
            "<a href='#' onclick='moveDown(this)' cellpadding='3' cellspacing='1' bgcolor='#c7dffc' style='margin-top:5px; margin-bottom:5px;'>下移</a> " +
            "<a href='#' onclick='deleteCurrentRow(this)'cellpadding='3' cellspacing='1' bgcolor='#c7dffc' style='margin-top:5px; margin-bottom:5px;'>删除</a>";
   
}


获取table 指定行和列的数据

function submitChargePackage() {
    var categoryTable = document.getElementById("mybody");
    var rows=categoryTable.rows;
   // alert("行数:" + rows.length);

   for(var i=0;i<rows.length;i++){
      // var uu = rows.cells.length;
         //alert(rows.cells.innerHTML);
    idList = rows.cells.innerHTML;
    nameList = rows.cells.innerHTML;
    chargePackageIdList = chargePackageIdList + idList;
    chargePackageNameList = chargePackageNameList + nameList;
   }
   
}
页: [1]
查看完整版本: js 操作table