Javascript:向表添加新行,跳过元素
不久前,我发现以下 javascript 函数允许您动态添加一行到表中:
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var colCount = table.rows[0].cells.length;
for(var i=0; i<colCount; i++) {
var newcell = row.insertCell(i);
newcell.innerHTML = table.rows[0].cells[i].innerHTML;
//alert(newcell.childNodes);
switch(newcell.childNodes[0].type) {
case "text":
newcell.childNodes[0].value = "";
break;
case "checkbox":
newcell.childNodes[0].checked = false;
break;
case "select-one":
newcell.childNodes[0].selectedIndex = 0;
break;
}
}
}
是否有人实际上有 javascript 经验(因为我几乎没有)可以编写一个修复程序来跳过 < ;th>
标签?
这是我不想受到影响的表格部分:
<table id="scheduler">
<tr>
<th scope="col">Engineer</th>
<th scope="col">Monday</th>
<th scope="col">Tuesday</th>
<th scope="col">Wednesday</th>
<th scope="col">Thursday</th>
<th scope="col">Friday</th>
<th scope="col">Saturday</th>
<th scope="col">Sunday</th>
</tr>
我的问题是,当我有 标签时,标题行最终成为“克隆”的行,而不是仅包含
标记的行。
Awhile back, I found the following javascript function that allows you to dynamically add a row to a table:
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var colCount = table.rows[0].cells.length;
for(var i=0; i<colCount; i++) {
var newcell = row.insertCell(i);
newcell.innerHTML = table.rows[0].cells[i].innerHTML;
//alert(newcell.childNodes);
switch(newcell.childNodes[0].type) {
case "text":
newcell.childNodes[0].value = "";
break;
case "checkbox":
newcell.childNodes[0].checked = false;
break;
case "select-one":
newcell.childNodes[0].selectedIndex = 0;
break;
}
}
}
Does anyone, that actually has javascript experience (cause I have almost none) that could write a fix that will skip over the <th>
tags?
Here's the part of the table I don't want to be affected:
<table id="scheduler">
<tr>
<th scope="col">Engineer</th>
<th scope="col">Monday</th>
<th scope="col">Tuesday</th>
<th scope="col">Wednesday</th>
<th scope="col">Thursday</th>
<th scope="col">Friday</th>
<th scope="col">Saturday</th>
<th scope="col">Sunday</th>
</tr>
My problem is that when I have the <th>
tags in, the header row ends up being the row that gets "cloned", not the row that just has <td>
tags in it.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
只需更改函数,以便您可以指定要复制的行(给定从零开始的索引)。
Just change the function so you can specify which row you want to duplicate (given a zero-based index).
试试这个:
Try This: