如何使一个表的输入列更新它的行与其他列的输入共享一个提交按钮?

Question

所以我基本上是在尝试做一个库存表的前端。为了简单起见，我们设它是3列。前2个专栏将在库存/租用。最后一栏是加减法。我不想对每一行(项)都这样做。有没有更好的方法在表格的底部只有一个提交按钮?这是我目前对一行

的设置

<tr>
<td>
<form>
<input type=”number”>
<input type=“submit”>
</form>
</td>
</tr>

正如您所看到的，这将是许多提交按钮，将不得不逐行更新。我该如何简化?

Answer 1

可以使用

function submits(){
const row1 = document.querySelectorAll(".row1");
const row2 = document.querySelectorAll(".row2");
for (let i = 0; i < row1.length; i++) {
row1values=row1values+","+nodeList[i].value;
}
for (let i = 0; i < row2.length; i++) {
row2values=row2values+","+nodeList[i].value;
}
}
function alerts(){
alert(allvalues)
}
var row1values = 0;
var row2values = 0;
//add onclick on submit at use event.preventDefault;
//The firsy coordinate will be 0,0
//you can join them lateer

对于第一个问题，在html5中使用colspan属性会有帮助。

最后一行代码将是

<tr><td colspan="2" style="text-align:center;background-color:blue;"><input type="button" onclick="submits()" value="Submit"></td></tr>