gpt4 book ai didi

javascript - 通过 Javascript 添加多个表行

转载 作者:行者123 更新时间:2023-11-28 21:17:06 24 4
gpt4 key购买 nike

我正在尝试通过 JavaScript 单击一次添加一定数量的行。到目前为止,我可以设法添加一行,但是有没有办法一键添加多行?我还可以添加 colspan 吗?

这是我的代码:

<html>
<head>
<title>Example of Problem</title>
<meta content="Microsoft Visual Studio 7.0" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript (ECMAScript)" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
<style type="text/css">

</style>
<script type="text/javascript">
function addrow(text) {
var row = document.createElement("tr");
var row2 = document.createElement("tr");

var td1 = document.createElement("td");
var td2 = document.createElement("td");

var td3 = document.createElement("td");
var td4 = document.createElement("td");

var input1 = document.createElement("input");
var input2 = document.createElement("input");
var input3 = document.createElement("input");
var input4 = document.createElement("input");

input1.className = "inputclass";
input1.setAttribute("name", "input1");
input1.setAttribute("id", "input1");
input1.setAttribute("type", "text");
td1.appendChild(input1);
row.appendChild(td1);

input2.className = "inputclass";
input2.setAttribute("name", "input2");
input2.setAttribute("id", "input2");
input2.setAttribute("type", "text");
input2.value = text;
td2.appendChild(input2);
row.appendChild(td2);

document.getElementById("ExampleTable").getElementsByTagName("tbody")[0].appendChild(row);
}
</script>

<table id="ExampleTable" style="WIDTH: 100%;" border="1">
<tr>
<td colspan="2" width="384"><font face="tahoma" size="2">Present / Last Employer</font></td>
<td colspan="2" width="384"><font face="tahoma" size="2">Address</font></td>
<td width="192"><font face="tahoma" size="2">Type of Business</font></td>
</tr>
<tr>
<td colspan="2" width="384"><input type="text" name="txtPresentLastEmployer1" size="50%"></td>
<td colspan="2" width="384"><input type="text" name="txtPLEAddress1" size="50%"></td>
<td width="192"><input type="text" name="txtTypeofBusiness1"></td>
</tr>
<tr>
<td colspan="2" width="384"><font face="tahoma" size="2">Job Title</font></td>
<td width="192"><font face="tahoma" size="2">Last Salary</font></td>
<td width="192"><font face="tahoma" size="2">Inclusive Dates</font></td>
</tr>
<tr>
<td colspan="2" width="384"><input type="text" name="txtJobTitle1" size="50%"></td>
<td width="192"><input type="text" name="txtJTLastSalary1"></td>
<td width="192"><input type="text" name="txtJTInclusiveDates1"></td>
</tr>
<tr>
<td colspan="2" width="384"><font face="tahoma" size="2">Name of Supervisor</font></td>
<td colspan="2" width="384"><font face="tahoma" size="2">Supervisor's Designation</font></td>
</tr>
<tr>
<td colspan="2" width="480"><input type="text" name="txtNameofSupervisor1" size="50%"></td>
<td colspan="2" width="480"><input type="text" name="txtSupervisorsDesignation1" size="50%"></td>
</tr>
</table>

<p>
<input id="Button1" type="button" value="AddRow" onclick="addrow('');" />
</p>
</body>
</html>

我们将非常乐意提供帮助。提前致谢!

最佳答案

Loupi,你的错误在这里:

td2.appendChild(input2);
row.appendChild(td2);

将其更改为:

td2.appendChild(input2);
row2.appendChild(td2);

那么它应该可以工作。

复制粘贴问题:D

关于javascript - 通过 Javascript 添加多个表行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7292799/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com