如何使用 cloneNode 克隆文本区域?
How to clone textareas with cloneNode?
我有 2 个表,我想通过一个按钮将内容从 tb_new
复制到 tb_made
:
var tab = document.getElementById('tb_new');
var clone=tab.getElementsByTagName('tr')[1].cloneNode(true);
var table = document.getElementById("tb_made");
table.appendChild(clone);
除了一个带有 textarea
的单元格外,一切都很好地克隆了。
我该如何解决?
Fiddle 是 here.
写入<textarea>
只会更新它的值,不会更新它的内容。
要解决此问题,您可以这样做:
function add() {
var tab = document.getElementById('tb_new');
var textAreas = tab.getElementsByTagName("textarea");
for (var i = 0; i < textAreas.length; ++i) {
textAreas[i].innerHTML = textAreas[i].value;
}
var clone = tab.getElementsByTagName('tr')[0].cloneNode(true);
var table = document.getElementById('tb_made');
table.appendChild(clone);
}
<table id="tb_new">
<tr>
<td>
<textarea>Test</textarea>
</td>
<td>
<input>
</td>
</tr>
</table>
<input type="button" value="add" onClick="add()">
<table id="tb_made">
<tr>
<td></td>
</tr>
</table>
我有 2 个表,我想通过一个按钮将内容从 tb_new
复制到 tb_made
:
var tab = document.getElementById('tb_new');
var clone=tab.getElementsByTagName('tr')[1].cloneNode(true);
var table = document.getElementById("tb_made");
table.appendChild(clone);
除了一个带有 textarea
的单元格外,一切都很好地克隆了。
我该如何解决?
Fiddle 是 here.
写入<textarea>
只会更新它的值,不会更新它的内容。
要解决此问题,您可以这样做:
function add() {
var tab = document.getElementById('tb_new');
var textAreas = tab.getElementsByTagName("textarea");
for (var i = 0; i < textAreas.length; ++i) {
textAreas[i].innerHTML = textAreas[i].value;
}
var clone = tab.getElementsByTagName('tr')[0].cloneNode(true);
var table = document.getElementById('tb_made');
table.appendChild(clone);
}
<table id="tb_new">
<tr>
<td>
<textarea>Test</textarea>
</td>
<td>
<input>
</td>
</tr>
</table>
<input type="button" value="add" onClick="add()">
<table id="tb_made">
<tr>
<td></td>
</tr>
</table>