如何通过填写前一个来自动生成新的输入字段？

Question

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

Adminer类似于在创建/更改数据库时添加新列的内容：

在这里点击+添加新输入，然后点击x删除它。这对我也有好处。 如何实现/我应该使用哪个库？

Answer 1

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

HTML：

<input type='text' />

JS：

$('input').on( 'change', function() {
    $(this).after( '<input type="text" />' );
    $('input').off( 'change' );
});

jsFiddle已关闭且jsBin无法处理额外负载，但here是一个演示。

Answer 2

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

示例代码：

$('#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);

});

直播DEMO。

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

$('#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();
  }
});