Javascript 如何通过填充以前的字段自动生成新的输入字段？

尽可能简单地说： 我有一个条件，我不知道我将在哪里有3个或更多的输入元素（“文本”类型），我正在寻找解决方案，当我开始用字符填充第3个输入字段时，将生成第4个输入类型的文本，以此类推

类似管理员在创建/更改数据库时添加新列的功能：

在这里，单击+添加新输入，单击x删除它。这对我也有好处。

---

如何实现这一点/我应该使用什么库？

如果没有代码示例，很难判断您想要得到什么，但是您想要这样的东西吗

HTML:

JS:

$（'input'）。在（'change'，function（）上{
$（本）。在（''）之后；
$（'input'）.off（'change'）；
});

---

JSFIDLE已关闭，jsBin无法处理额外的负载，但这是一个演示。

您可以克隆整行，并将其附加到父表中。看看jQuery和

示例代码：

$('#yourtableid').on('click', '.add', function() {

   // clone first row
   var row = $('#yourtableid tbody tr:first').clone();

   // reset inputs 
   row.find('input[type!=button]').val('');

   // append cloned row 
   $('#yourtableid tbody').append(row);

});

活着

编辑：若要在最后一行填充某些文本时自动添加行，您可以使用：

$('#tbl').on('change', 'input', function() {

  // check that some input was entered and that it is in the last tr
  if($(this).val() != '' &&
     $(this).closest('tr').is(':last-child')) {
    addRow();
  }
});

---

任何能让你的船漂浮的东西。哈哈！如果你说的是有效的HTML，那么这肯定会让我的船漂浮起来。@BenM 1。非自动关闭输入元素是完全有效的HTML5，各种非自动关闭标记也是如此。2.我没有指定doctype。如果这是严格的XHTML，则标记不能自动关闭。3.一切都好吗？你看起来有点沮丧。非常感谢。我真的不知道。请在这个问题中插入一些代码。在看不到您尝试过的内容的情况下，很难说出您想要什么。我在问是否有用于此的库，我在jquery UIno中找不到这样的功能，例如，这是一个足够简单的问题，不符合标准UX问题的条件，所以我认为大多数库让您插入这4行代码。此外，如果您不熟悉javascript，可以尝试twitter引导，而不是jquery ui。它为您提供了一个更完整（值得商榷）的前端框架，外观更好，更易于使用。这解释了问题中给出的不相关示例，但并没有真正回答问题：“我正在寻找解决方案，当我开始用字符填充第三个输入字段时，将生成第四个输入类型的文本，依此类推。”

$('#yourtableid').on('click', '.add', function() {

   // clone first row
   var row = $('#yourtableid tbody tr:first').clone();

   // reset inputs 
   row.find('input[type!=button]').val('');

   // append cloned row 
   $('#yourtableid tbody').append(row);

});

$('#tbl').on('change', 'input', function() {

  // check that some input was entered and that it is in the last tr
  if($(this).val() != '' &&
     $(this).closest('tr').is(':last-child')) {
    addRow();
  }
});