其实就是操作DOM。下面的简单的例子:
<script>
function col()
{
if(event.srcElement.innerText=='删除整行')
{
document.all.mxh.childNodes(0).removeChild(event.srcElement.parentElement)
}
if(event.srcElement.innerText=='删除整列')
{
tmp=event.srcElement.cellIndex
for(var i=0;i<document.all.mxh.rows.length;i++)
if(document.all.mxh.rows(i).cells(tmp)) document.all.mxh.rows(i).removeChild(document.all.mxh.rows(i).cells(tmp))
}
if(event.srcElement.innerText=='合并单元格')
{
if((event.srcElement.cellIndex - 1) < 0 ) return
event.srcElement.parentElement.removeChild(event.srcElement.parentElement.cells(event.srcElement.cellIndex - 1))
event.srcElement.colSpan = "2"
}
}
</script>
<table id=mxh border="1" onclick="col()">
<tr>
<td>11</td><td>12</td><td>删除整列</td><td>删除整列</td><td>删除整行</td>
</tr>
<tr>
<td>21</td><td>22</td><td>23</td><td>24</td><td>删除整行</td>
</tr>
<tr>
<td>31</td><td>32</td><td>33</td><td>34</td><td>删除整行</td>
</tr>
<tr>
<td>31</td><td>32</td><td>33</td><td>34</td><td>合并单元格</td>
</tr>
</table>
<script>
function col()
{
if(event.srcElement.innerText=='删除整行')
{
document.all.mxh.childNodes(0).removeChild(event.srcElement.parentElement)
}
if(event.srcElement.innerText=='删除整列')
{
tmp=event.srcElement.cellIndex
for(var i=0;i<document.all.mxh.rows.length;i++)
if(document.all.mxh.rows(i).cells(tmp)) document.all.mxh.rows(i).removeChild(document.all.mxh.rows(i).cells(tmp))
}
if(event.srcElement.innerText=='合并单元格')
{
if((event.srcElement.cellIndex - 1) < 0 ) return
event.srcElement.parentElement.removeChild(event.srcElement.parentElement.cells(event.srcElement.cellIndex - 1))
event.srcElement.colSpan = "2"
}
}
</script>
<table id=mxh border="1" onclick="col()">
<tr>
<td>11</td><td>12</td><td>删除整列</td><td>删除整列</td><td>删除整行</td>
</tr>
<tr>
<td>21</td><td>22</td><td>23</td><td>24</td><td>删除整行</td>
</tr>
<tr>
<td>31</td><td>32</td><td>33</td><td>34</td><td>删除整行</td>
</tr>
<tr>
<td>31</td><td>32</td><td>33</td><td>34</td><td>合并单元格</td>
</tr>
</table>
解决方案 »
- JS内嵌PHP问题
- 一个支持N级下拉列表联动的控件
- js如何实现点击后自动粘贴
- Firefox浏览器下无法正常取到iframe的表单控件值
- String.prototype.trim = function(){return this.replace(/^\s+(.*?)\s+$/,"$1")}
- javascript 加入options到select中
- WScript.Shell 能改为标记为安全吗
- 大家一起来写触发事件------文字编辑器功能提升:实现单行文本框,这个触发事件该咋么写?
- javascript竟然没有left函数
- 请问:如何点击不同的链接选择不同的iframe
- JavaScript 初学,如何让动态显现的popup menu 正常无遮盖 在ActiveX控件上面显示
- wsh=new ActiveXObject("wscript.shell")的问题!!!
<table id="tbl" border="1" cellpadding="0" cellspacing="0">
<tr><td>hello</td><td>world</td><td>hello</td><td>world</td></tr>
<tr><td>hello</td><td><b>china</b></td><td>hello</td><td>china</td></tr>
</table>
<input type="button" value="merge 2nd row, 1,2,3 cells" onclick="merge(1,0,2)">
<input type="button" value="merge 1nd row, 1,2 cells" onclick="merge(0,0,1)">
<script language="javascript">
function merge(nRow, nColStart, nColEnd)
{
var rows = tbl.rows;
if (nRow < 0 || nRow >= rows.length)
return; var cells = rows[nRow].cells;
if (nColStart < 0 || nColStart >= cells.length || nColEnd < 0 || nColEnd >= cells.length ||
nColStart > nColEnd)
return; var s= "";
for (var i=nColStart; i <=nColEnd; i++)
s += cells[i].innerHTML + " "; for (var i=nColStart; i <nColEnd; i++)
rows[nRow].deleteCell(nColStart); rows[nRow].cells[nColStart].colSpan = nColEnd - nColStart + 1;
rows[nRow].cells[nColStart].innerHTML = s;
}
</script>
我该如何用javascript实现添加一行
行中也包括文本框