87,910
社区成员
发帖
与我相关
我的任务
分享在利用DHTML动态增加一行的时候,如何能够将上一行的内容全盘复制到新行中？
<table id="idTB" border=0><!--注意id，与JS中的要相对应-->
<tr id=idTR>
<td>第一行 <input type='button'>dsafsadfsdf</td>
</tr>
</table>
<input type="button" onclick="addRow()" value="添加一行"><br>
function addRow(){//添加表格的一行
oTR = idTB.insertRow(idTB.rows.length);
tmpNum=oTR.rowIndex;
oTD=oTR.insertCell(0);
oTD.innerText="第" + tmpNum+"行";
oTD.innerHTML="<input type='text' name='txt"+tmpNum+"'>";。
idLast.innerText=idTB.rows.length;
return true;
}
也就是如何能将原有行的内容给自动复制到新增的行中，而不是使用innerHTML的方式增加新行内容?
<tr id=idTR>
<td>第一行 <input type='button'>dsafsadfsdf</td>
</tr>
</table>
<input type="button" onclick="addRow()" value="添加一行"><br>
function addRow(){//添加表格的一行
oTR = idTB.insertRow(idTB.rows.length);
tmpNum=oTR.rowIndex;
oTD=oTR.insertCell(0);
oTD.innerText="第" + tmpNum+"行";
oTD.innerHTML="<input type='text' name='txt"+tmpNum+"'>";。
idLast.innerText=idTB.rows.length;
return true;
}
也就是如何能将原有行的内容给自动复制到新增的行中，而不是使用innerHTML的方式增加新行内容?
...全文
请发表友善的回复…
发表回复
mingxuan3000 2006-03-20
- 打赏
- 举报
function addRow(){
var tblObj = document.getElementById("table1");
if(tblObj.rows){
alert(tblObj.rows.length);
}else{
alert('aaa');
}
//追加行
var newRow = tblObj.insertRow();
newRow.style.display = "";
var cellNum = tblObj.rows[0].cells.length;
//追加列
for (colIndex = 0; colIndex < cellNum; colIndex++) {
var newCell = newRow.insertCell();
initTblCell(newCell);
}
}
function initTblCell(cell){
var lastCell = document.getElementById("table1").rows[0].cells[cell.cellIndex];
cell.innerHTML = lastCell.innerHTML;
alert(cell.innerHTML);
if (cell.children != null && cell.children.length > 0) {
for(childIndex = 0; childIndex < cell.children.length; childIndex++) {
var child = cell.children[childIndex];
switch(child.type) { //如果保持上一行的内容这里就不要了,这主要是清空
case "text":
child.value = "";
break;
case "checkbox":
child.value = "";
child.checked = false;
break;
}
}
}
cell.className = lastCell.className;
cell.align = lastCell.align;
cell.height = lastCell.height;
}
function buttonFun(){
var obj= document.getElementsByName("text4");
for(i=1;i<obj.length;i++){
alert(obj[i].value);
}
}
function dellRow(){
var obj= document.getElementById("table1");
var objRow=obj.rows.length-1;
alert(objRow);
if(objRow != 0){
obj.deleteRow(objRow);
}
}
<table id="table1" name="table1" width="300">
<tr style="display:none">
<td width="100">
<input type="button" name="testBtn4" value="button" onclick=""/>
</td>
<td width="100">
<input type="text" name="text4" id="text4"/>
</td>
<td width="100">
123
</td>
</tr>
<tr>
<td width="100">
<input type="button" name="testBtn4" value="button" onclick="toExcel_Page()"/>
</td>
<td width="100">
<input type="text" name="text4" id="text4"/>
</td>
<td width="100">
123
</td>
</tr>
</table>
<input type="button" name="testAdd" id="testAdd" value="AddRow" onclick="addRow()"/>
<input type="button" name="testAdd" id="testAdd" value="DellRow" onclick="dellRow()"/>
<input type="button" name="testAdd2" id="testAdd2" value="GetTextValue" onclick="buttonFun()"/>
var tblObj = document.getElementById("table1");
if(tblObj.rows){
alert(tblObj.rows.length);
}else{
alert('aaa');
}
//追加行
var newRow = tblObj.insertRow();
newRow.style.display = "";
var cellNum = tblObj.rows[0].cells.length;
//追加列
for (colIndex = 0; colIndex < cellNum; colIndex++) {
var newCell = newRow.insertCell();
initTblCell(newCell);
}
}
function initTblCell(cell){
var lastCell = document.getElementById("table1").rows[0].cells[cell.cellIndex];
cell.innerHTML = lastCell.innerHTML;
alert(cell.innerHTML);
if (cell.children != null && cell.children.length > 0) {
for(childIndex = 0; childIndex < cell.children.length; childIndex++) {
var child = cell.children[childIndex];
switch(child.type) { //如果保持上一行的内容这里就不要了,这主要是清空
case "text":
child.value = "";
break;
case "checkbox":
child.value = "";
child.checked = false;
break;
}
}
}
cell.className = lastCell.className;
cell.align = lastCell.align;
cell.height = lastCell.height;
}
function buttonFun(){
var obj= document.getElementsByName("text4");
for(i=1;i<obj.length;i++){
alert(obj[i].value);
}
}
function dellRow(){
var obj= document.getElementById("table1");
var objRow=obj.rows.length-1;
alert(objRow);
if(objRow != 0){
obj.deleteRow(objRow);
}
}
<table id="table1" name="table1" width="300">
<tr style="display:none">
<td width="100">
<input type="button" name="testBtn4" value="button" onclick=""/>
</td>
<td width="100">
<input type="text" name="text4" id="text4"/>
</td>
<td width="100">
123
</td>
</tr>
<tr>
<td width="100">
<input type="button" name="testBtn4" value="button" onclick="toExcel_Page()"/>
</td>
<td width="100">
<input type="text" name="text4" id="text4"/>
</td>
<td width="100">
123
</td>
</tr>
</table>
<input type="button" name="testAdd" id="testAdd" value="AddRow" onclick="addRow()"/>
<input type="button" name="testAdd" id="testAdd" value="DellRow" onclick="dellRow()"/>
<input type="button" name="testAdd2" id="testAdd2" value="GetTextValue" onclick="buttonFun()"/>
kangqin 2006-03-20
- 打赏
- 举报
用clonenode
<body>
<table id="idTB" border=0><!--注意id，与JS中的要相对应-->
<tr id=idTR>
<td>第一行 <input type="button" />dsafsadfsdf</td>
</tr>
</table>
<input type="button" onclick="addRow()" value="添加一行"><br>
<script type="text/javascript">
function addRow(){//添加表格的一行
var source=document.getElementById("idTR");
var container=document.getElementById("idTB");
var copy=source.cloneNode(true);
if(container.getElementsByTagName("TBODY"))
container=container.getElementsByTagName("TBODY")[0];
container.appendChild(copy);
}
</script>
</body>
<body>
<table id="idTB" border=0><!--注意id，与JS中的要相对应-->
<tr id=idTR>
<td>第一行 <input type="button" />dsafsadfsdf</td>
</tr>
</table>
<input type="button" onclick="addRow()" value="添加一行"><br>
<script type="text/javascript">
function addRow(){//添加表格的一行
var source=document.getElementById("idTR");
var container=document.getElementById("idTB");
var copy=source.cloneNode(true);
if(container.getElementsByTagName("TBODY"))
container=container.getElementsByTagName("TBODY")[0];
container.appendChild(copy);
}
</script>
</body>
DeluxWorld 2006-03-20
- 打赏
- 举报
http://community.csdn.net/Expert/topic/4626/4626294.xml?temp=.9054987
dipingxian 2006-03-20
- 打赏
- 举报
多谢！～！顺便问问仁兄，是否有动态增加、删除、表格行的通用的代码 共享下？ 多谢！
hbhbhbhbhb1021 2006-03-20
- 打赏
- 举报
只是把原行的innerHTML给新行就可以了
<table id="idTB" border=0><!--注意id，与JS中的要相对应-->
<tr id=idTR>
<td>第一行 <input type='button'>dsafsadfsdf</td>
</tr>
</table>
<input type="button" onclick="addRow()" value="添加一行"><br>
<script language=javascript>
function addRow(){//添加表格的一行
oTR = idTB.insertRow(idTB.rows.length);
oTD=oTR.insertCell(0);
oTD.innerHTML=document.getElementById("idTR").childNodes[0].innerHTML;
return true;
}
</script>
<table id="idTB" border=0><!--注意id，与JS中的要相对应-->
<tr id=idTR>
<td>第一行 <input type='button'>dsafsadfsdf</td>
</tr>
</table>
<input type="button" onclick="addRow()" value="添加一行"><br>
<script language=javascript>
function addRow(){//添加表格的一行
oTR = idTB.insertRow(idTB.rows.length);
oTD=oTR.insertCell(0);
oTD.innerHTML=document.getElementById("idTR").childNodes[0].innerHTML;
return true;
}
</script>
