Question

我有一个表格，例如，允许人们输入他们所有的兄弟姐妹。这可能是0或100（取决于他们父母的忙碌程度）。如何让输入字段自动增长？我现在有一个表单，用户单击“添加更多兄弟姐妹”并添加一个输入字段，但该按钮让我烦恼，所以我试图找到一种方法，一旦他们开始绑定一个新的空白字段。因此，只要您输入您的兄弟姐妹名称，就会在下方显示一个新字段，因此当您完成该兄弟姐妹信息后，您可以继续使用下一个信息（当您键入该信息时，下面会显示一个新输入）。

此外，如果它有所帮助，我的长期目标是对所输入的项目提供一些“分析”，以便他们输入他们的兄弟姐妹信息，它将显示平均年龄，验证没有兄弟姐妹比父母更老（和可能的错误警告）等发送到服务器之前。

我对网络开发很新，并且一直在学习jquery，但我不确定jquery是否可以做我正在尝试做的事情，并且想知道是否有人可以告诉我我需要学习哪些技术来实现这一目标（我认为ajax但是如果可能的话就找不到多少。我当前（新手）的方法是拥有50个字段并将它们全部隐藏起来，当用户点击“添加更多兄弟姐妹”时，它只是取消隐藏下一个字段。有没有更好的方法来做到这一点，或者如果我目前的方式是好的是有一种方法来修改它，以消除“添加更多的兄弟姐妹”按钮的需要？一个例子会很棒，但实际上我只是想对我需要做的事情进行高级解释，所以我知道要寻找什么（并自己学习）。

Answer 1

我不难。观察输入中的键事件，当当前输入是最后一个输入时添加新输入（例如使用$.after()）

演示：http://jsfiddle.net/doktormolle/WaL84/

Answer 2

应该可以使用jQuery。我建议在jsfiddle进行试验并提供一些有用的例子。或者可以帮助您更好地理解您想要实现的目标。

我在这里开始了http://jsfiddle.net/krishollenbeck/jyQTN/

请告诉我这是否是您所指的。或者，如果我完全离开。

<input type="text" class="input"/>


$('.input').focus(function(){
    $('<input type="text" />').insertAfter('.input')
});

我确信你要找的东西更精细。但这是你想要实现的最基本形式吗？

Answer 3

我创造了一个非常基本的小提琴。它没有造型，但它实现了我认为的理想结果。

小提琴 - http://jsfiddle.net/ZqQ7Y/4/

如何制作输入自动增长的表单？

3 个答案: