Javascript 单击按钮后添加新输入

我需要有一个按钮，它将添加一个新的文本和输入后，每次点击按钮

单击按钮一次后所需的输出

但给定以下代码，我的新输入将覆盖初始输入

桌子
输入
添加新输入
$（文档）.ready（函数（）{
$（'#addnewinputbtn'）。单击（函数（）{
$（'tr'）。附录（'tbody'））
.html(
"新输入";；
});
});

桌子
输入
添加新输入
$（文件）
.准备好了吗(
函数（）{
$（'#addnewinputbtn'）
.点击(
函数（）{
$（“tbody”）
.附加(
"新输入";；
});
});

此代码

 $('tr').appendTo('tbody').html(
   '<td>New Input <input type="text" class="form-control" readonly="readonly"></td>');
 });

$（'tr'）.appendTo（'tbody'）.html(
"新输入";；
});

tr上的.html（）将用新的输入td元素替换tr元素的html，您应该在tr元素中附加新的输入td元素

已编辑：此代码将替换DOM中tr元素的html，因为选择器$（'tr'）将选择DOM中存在的tr元素

$('tr').appendTo('tbody')
          .html(
            '<td>New Input <input type="text" class="form-control" readonly="readonly"></td>');
      });

$（'tr'）.appendTo（'tbody'））
.html(
"新输入";；
});

但是如果您想要创建一个新的tr元素，那么代码应该是

$（''）.appendTo（'tbody'） .html( "新输入";； });

$（''）将创建一个新元素

桌子
输入
添加新输入
$（文件）
.准备好了吗(
函数（）{
$（'#addnewinputbtn'）
.点击(
函数（）{
$（''）.appendTo（'tbody'）.html(
"新输入";；
});
});

试着附加它，改为执行

tr

：

---

这将附加一个嵌套在tr标记中的新元素，而不是将新元素附加到主体中，从而覆盖自身

您可以使用Jquery

append

添加另一个元素

函数AddTextBox（）{
$（“#populateInput”）。追加（“”）
}

添加输入

但它会附加到前一个输入的侧面。我希望它附加在前一个输入的下面。是否要新行？您的代码看起来像是在试图添加一个新的td。@TestAccount更新了示例以添加一个新行而不是td元素。@TestAccount，我还更新了代码不工作的原因。这是代码中的一个小错误，但同时更改了功能。但它附加到了以前输入的一侧。我希望它附加在前一个输入的下面。@TestAccount现在测试它

$('tr').append(...);