我在做什么？
我正在制作一个事务保存应用程序，它可以选择批量添加事务。它是一种里面有一张桌子的表格。表格的每一行代表一个事务，每个单元格都有一个输入字段。有一个删除行的选项和一个添加行的选项。
问题
我有两个问题：
- 添加行时，如何为选择获取原始选项，然后将它们添加到新选择中。
- 删除一行时，将所有其他输入的
name属性 1 向下移动。
代码
迄今为止尝试的第一个问题的代码
<!-- HTML START -->
<?php
$conn = new mysqli('localhost', 'admin', 'myphpadmin', 'tests');
$merch = $conn->query("Select Name From options Where `Type` = 'Merchant'");
$type = $conn->query("Select Name From options Where `Type` = 'Type'");
$source = $conn->query("Select Name From options Where `Type` = 'Source'")
?>
<!DOCTYPE html>
<html>
<head>
<title>Add In Bulk</title>
<link rel='stylesheet' href='styles.css' type='text/css'>
<style>
td{width: calc(100% / 6);
overflow-x: hidden}
</style>
</head>
<body>
<h1>Add In Bulk</h1>
<form action='bulk.php' method='post'>
<table>
<tr>
<th>Description</th>
<th>Date</th>
<th>Amount</th>
<th>Merchant</th>
<th>Type</th>
<th>Source</th>
<th>Delete</th>
</tr>
<tr>
<td><input type='text' name='des1' required></td>
<td><input type='data' name='d1' required></td>
<td><input type='number' step='0.01' min='0' name='a1' required></td>
<td><select name='m1' required id='m'>
<option value='' disable selected>Select One</option>
<?php
while($row = mysqli_fetch_assoc($merch)){
foreach($row as $value){
echo "<option value='$value'>$value</option>";}}
?>
</select>
</td>
<td><select name='t1' required id='t'>
<option value='' disable selected>Select One</option>
<?php
while($row = mysqli_fetch_assoc($type)){
foreach($row as $value){
echo "<option value='$value'>$value</option>";}}
?>
</select>
</td>
<td><select name='s1' required id='s'>
<option value='' disable selected>Select One</option>
<?php
while($row = mysqli_fetch_assoc($source)){
foreach($row as $value){
echo "<option value='$value'>$value</option>";}}
?>
</select>
</td>
<td><button class='del'>Delete</td></tr>
</table>
</form>
<button id='add'>Add</button>
<script src='..\..\jquery.js'></script>
<script src='bulk.js'>
</script>
</body>
</html>
<!-- HTML END -->
<!-- BULK.js START -->
/*==================Get The Option Values======================*/
var merchants = []
var type = []
var source = []
$("#m option").each(function() {merchants.push(this.value);});
$("#s option").each(function() {source.push(this.value);});
$("#t option").each(function() {type.push(this.value);});
/*==================ForEach Function======================*/
function addoptions(item){return "<option value='" + item + "'>" + item + "</option>";}
/*==================Declare Variables======================*/
var table = document.getElementsByTagName('table');
var tr = document.getElementsByTagName('tr');
var fun = `
<tr>
<td><input type='text' name='des` + ((tr.lenght) + 1).toString() + `' required></td>
<td><input type='data' name='d` + ((tr.lenght) + 1).toString() + `' required></td>
<td><input type='number' step='0.01' min='0' name='a` + ((tr.lenght) + 1).toString() + `1' required></td>
<td><select name='m` + ((tr.lenght) + 1).toString() + `' required id='m'>
<option value='' disable selected>Select One</option>` + merchants.forEach(addoptions); + `
</select>
</td>
<td><select name='t` + ((tr.lenght) + 1).toString() + `' required id='t'>
<option value='' disable selected>Select One</option>` + type.forEach(addoptions); + `
</select>
</td>
<td><select name='s` + ((tr.lenght) + 1).toString() + `' required id='s'>
<option value='' disable selected>Select One</option>` + source.forEach(addoptions); + `
</select>
</td>
<td><button class='del'>Delete</button></td>`;
/*==================Delete Rows======================*/
$(document).on("click", ".del" , function(){
$(this).closest('tr').remove();
/*if(tr.lenght == 0){table.remove;} Why Does This Not Work? */
})
/*==============Add Rows==========================*/
//Adding Rows
$('#add').click(function(e){
$(table).push(fun)})
<!-- BULK.js END -->
第二个问题
我不知道从哪里开始！
笔记
jQuery 版本：3.5.1
PHP：工作 - 确认
获取选项值：工作 - 确认（使用
console.log()）
对我有什么问题吗？
谢谢，我希望我提供的已经足够了！