选择添加按钮时需要显示额外的文本输入，还需要删除字段答案

【问题标题】：need to display extra text inputs when selecting add button, also need to remove fields选择添加按钮时需要显示额外的文本输入，还需要删除字段
【发布时间】：2011-04-05 16:58:10
【问题描述】：

我有一个要求用户输入项目结果的表单。

他们需要输入至少一个结果，并且每个结果都需要至少 2 个与之相关的度量。

因此，我需要能够向用户呈现初始结果字段，以及与之关联的两个度量字段，并能够为其相关结果添加更多度量。

我勾勒出如果用户有两种结果会是什么样子。

虚线是每个按钮的动作。

我想使用 jQuery 来实现这一点，但我从来没有做过任何事情，只是根据用户点击的内容显示/隐藏一个字段。

感谢任何帮助。

总而言之，他们需要提供一个结果，每个结果至少有两个度量。

编辑：在这里开始校对：http://jsfiddle.net/bkmorse/FW6s8/4/ - 但添加测量按钮无法正常工作。

【问题讨论】：

api.jquery.com/clone clone() 是您所需要的。但是，请确保您编辑了克隆的 ID，以便您可以识别它
我希望使表单动态化，我不确定需要多少字段，这取决于用户需要多少结果以及针对每个结果的多少度量。我不确定克隆是否能满足这种情况，但我不是专家。
我写了一个名为 jquery.duplicatah 的插件，我在一个项目中使用它，它还没有向公众发布。如果没有人为您提供更好的选择，我可以打包并为您上传。它完全符合您的要求。是的，它使用了很多 jquery.clone() 黑魔法！
@Federico - 谢谢，我差不多了，jsfiddle.net/bkmorse/FW6s8/4

标签： javascript jquery html forms

【解决方案1】：

这是我整理的：

http://jsfiddle.net/jtbowden/XFsyh/

最棘手的部分，大部分代码是处理表单输入名称。

代码的主要部分取决于添加元素时克隆的非显示模板。这样可以更轻松地创建新元素，因为您只需修改模板。

更新：这是一个允许您删除第一个结果/度量（只要其他结果/度量存在）的版本，另外我还清理了一些其他内容（错误）：

http://jsfiddle.net/jtbowden/XFsyh/4/

注意.live()的使用。您示例中的按钮不起作用，因为您在这些按钮存在之前分配了一次处理程序。 .live() 将处理程序分配给 DOM 的根，以便以后添加的任何元素也将具有正确的处理程序。

根据您的要求，这是带有修复的原始版本：

http://jsfiddle.net/jtbowden/JTUkE/

如果你想要动画：

http://jsfiddle.net/jtbowden/brBSa/

【讨论】：

太棒了！您最近对其版本 3 的更新，它在它的第一个版本中运行良好。
其他版本存在一些错误。当我找到它们时，我正在清理它们。这就是当您即时编码而不是先计划时会发生的情况。
revision 4，我不希望他们能够像原始代码中那样删除第一个结果及其相关措施。
好的，上面添加了原始/固定版本。