【js】動態合併表格
阿新 • • 發佈:2019-01-24
//動態合併表格 //傳入引數:tableObj(表格ID); //childNodeIndexs:需要合併的列索引可傳多列索引用逗號分割如:(‘0,1,2’表示合併表格的一二三列資料,注意傳入索引時必須按照 從前往後的順序) function setRowSpan(tableObj,childNodeIndexs){ try{ var childNodeIndex; //定義需要合併的索引陣列 //如果傳進來的索引不為空就已傳進來的索引進行合併,否則就按照表格的第一列進行合併 if(childNodeIndexs!=null){ childNodeIndex=childNodeIndexs.split(","); }else{ childNodeIndex[0]='0'; } //得到需要合併的表格物件 var tableObj = document.getElementById(tableObj); //得到表格的tbody包體物件 var nodes=tableObj.childNodes[1].childNodes; var objList= new Array() ; var c = 1; //對包體中表格的列進行迴圈 for(var k=0;k<nodes.length;k++){ //得到當前行的值 var curValue=nodes[k].childNodes[parseInt(childNodeIndex[0])].innerHTML; //定義下一行的值 var nextValue=""; if(nodes[k+1]!=null){ nextValue=nodes[k+1].childNodes[parseInt(childNodeIndex[0])].innerHTML; } //如果當前行的值和下一行值相等則把需要合併行的數目加"1",並把下一行的物件放到集合中 if(curValue == nextValue){ objList.push(nodes[k+1].childNodes[parseInt(childNodeIndex[0])]); c++; }else{ //如果當前行的值和下一行的值不行等,則從值相等的那一行的td進行行合併rowSpan=c(c:表示判斷值 相等的次數預設為1) for(var i=0;i<childNodeIndex.length;i++){ nodes[k-c+1].childNodes[parseInt(childNodeIndex[i])].rowSpan=c; } //迴圈把合併行的單元格移除,直流最後一行 for(var d=0;d<objList.length;d++){ var pNode=objList[d].parentNode; //定義移除單元格的次數,母的每移除一個單元格,之前的索引要減去"1" var index=0; for(var i=0;i<childNodeIndex.length;i++){ pNode.removeChild(pNode.childNodes[parseInt(childNodeIndex[i]-index)]); index++; } } //重置變數初始值 c=1; objList=new Array(); } } }catch(e){ return false; } } <script> //頁面載入時,呼叫公共的js用於表格顯示合併相同課程教學班 setRowSpan("row",'0'); </script>