我有一个数据表如下 -
<table class="table" id = "myTable>
<tr>
<td> <b> ID </b> </td>
<td> <b> First Name </b> </td>
<td> <b> Last Name </b> </td>
</tr>
我有一个输入表单部分如下 -
<form>
<input type="text" id ="userID">
<input type="text" id ="firstname">
<input type="text" id ="lastname">
<input type="submit">
</form>
有人可以帮我解决在我的表中添加新行所需的javascript,其中包含从用户输入表单中获取的数据吗?
答案 0 :(得分:2)
你不需要jQuery来做到这一点。只需使用javascript。 你可以使用这样的函数:
单击提交按钮时具有功能的HTML ..
<table class="table" id = "myTable">
<tr>
<td> <b> ID </b> </td>
<td> <b> First Name </b> </td>
<td> <b> Last Name </b> </td>
</tr>
</table>
<form action="">
<input type="text" id ="userID" />
<input type="text" id ="firstname" />
<input type="text" id ="lastname" />
<input type="submit" onclick="return fillTable();" />
</form>
的JavaScript
function fillTable() {
var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
cell1.innerHTML = document.getElementById("userID").value;
cell2.innerHTML = document.getElementById("firstname").value;
cell3.innerHTML = document.getElementById("lastname").value;
return false;
}