以下代码适用于最新版本的Firefox,Chrome,Safari和IE,但不适用于Opera。当我使用Opera点击添加按钮时,似乎已经在行中添加了一个非常薄的空间,但没有别的......有人可以帮忙吗? 表格:
<form method="post" action="send.php">
<table id="table">
<tr><th>job</th><th>comment</th></tr>
<tr>
<td><textarea name = "job[]"></textarea></td>
<td><textarea name = "comment[]"></textarea></td>
<tr>
</table>
<input type ="button" value="add entry" onclick="add('table')"/>
<input type ="submit" id="submit" value="submit"/>
JavaScript:
var names = ['job[]', 'comment[]'];
function add(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);
var newentry = document.createElement('textarea');
newentry.type = "text";
newcell.appendChild(newentry);
}
}
答案 0 :(得分:2)
设置newentry.type
给出
Uncaught exception: DOMException: NO_MODIFICATION_ALLOWED_ERR
实际上,textarea
,http://www.w3schools.com/tags/tag_textarea.asp没有类型属性。如果您使用input
,则需要该类型。
如果删除设置类型的行,则效果很好。
我还发现了代码中的另一个错误:你没有关闭第二行,而是打开一个新行。
这是一个很好的代码:
<tr>
<td><textarea name = "job[]"></textarea></td>
<td><textarea name = "comment[]"></textarea></td>
</tr>
答案 1 :(得分:1)
这一行:newentry.type = "text";
在Opera中导致异常:Uncaught exception: DOMException: NO_MODIFICATION_ALLOWED_ERR
。该行无论如何都没有做任何事情(至少在Chrome中),所以我想你可以删除它。
var newentry = document.createElement('textarea');
newentry.type = "text";
console.log(newentry.type);
-> textarea
答案 2 :(得分:0)
使用.createElement
之类的原生DOM方法创建所有浏览器都支持的TR(行)和TD(单元格)。
您的代码可能如下所示:
var names = ['job[]', 'comment[]'];
function add(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.getElementsByTagName("TR").length;
var row = document.createElement("TR")
var colCount = table.getElementsByTagName("TR")[0].childNodes.length;
for (var i=0; i<colCount; i++) {
var newcell = document.createElement("TD");
row.appendChild(newcell);
var newentry = document.createElement('textarea');
newentry.type = "text";
newcell.appendChild(newentry);
}
}
table.appendChild( row );
}
我没有测试上面的代码,但它会帮助你实现目标。