如何在特定索引处添加表行和列 [英] How to add table row and colums at specific index
本文介绍了如何在特定索引处添加表行和列的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
如何在单击表格单元格时添加特定索引处的表格行或表格列，与excel表格相同。
我尝试了什么：
How to add a table row or table column at specific index by on clicking the table cells, same as excel sheet.
What I have tried:
<table >
<tr>
<th></th>
<th></th>
<th></th>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
添加行的脚本：
script to add row:
function AppendRows() {
var tableRows = document.getElementById('myTable'),
row = tableRows.insertRow(tableRows.rows.length);
row.height = '50';
for (var i = 0; i < tableRows.rows[0].cells.length; i++) {
row.insertCell(i), i, 'row';
}
}
推荐答案
我只为你写了这个！
I wrote this just for you!
<HTML>
<STYLE>
.space {
background:url('data:images/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAMSURBVBhXY5h58xUABGsCXQMuL3UAAAAASUVORK5CYII=');
height:5px;
cursor: pointer;
}
</STYLE>
<SCRIPT>
function onrow_click(t) {
var currentRowIndex = t.rowIndex;
if(currentRowIndex % 2 != 0) {
return;
}
var pickIndex;
if(t.parentElement.rows.length == t.rowIndex + 1) {
pickIndex = currentRowIndex - 1;
} else {
pickIndex = currentRowIndex + 1;
}
var col_count = t.parentElement.rows[pickIndex].cells.length; //
var newRow = t.parentElement.insertRow(currentRowIndex + 1);
for(var i=0;i<col_count;i++) {
var newCol = newRow.insertCell();
newCol.innerHTML="Bold";
}
var newEmptyRow = t.parentElement.insertRow(currentRowIndex + 2);;
var newEmptyCol = newEmptyRow.insertCell();
newEmptyCol.colSpan = col_count;
newEmptyCol.className = "space";
newEmptyCol.onclick = onclick="onrow_click(this)";
}
</SCRIPT>
<BODY>
<TABLE id='dd' border=1 cellpadding=0 cellspacing=0>
<TR class="space" onclick="onrow_click(this)">
<TD colspan=3></TD>
</TR>
<TR>
<TD>TEST 1</TD>
<TD>TEST 2</TD>
<TD>TEST 3</TD>
</TR>
<TR class="space" onclick="onrow_click(this)">
<TD colspan=3></TD>
</TR>
<TR>
<TD>TEST 4</TD>
<TD>TEST 5</TD>
<TD>TEST 6</TD>
</TR>
<TR class="space" onclick="onrow_click(this)">
<TD colspan=3></TD>
</TR>
</TABLE>
</BODY>
</HTML>
这篇关于如何在特定索引处添加表行和列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
