Javascript 添加输入字段，在其中循环并将值输出到div

我有点生锈，所以这可能是一个简单的解决办法。我试图通过AddMore按钮获取动态添加输入字段的代码。然后使用jquery，代码循环获取输入字段的值并附加一个div

$（函数（）{
$（'.addurl'）。单击（函数（）{
$（'.more'）.add（''）.appendTo（'.more'）；
});
$（'.more'）。在（'change'，function（）上{
$（'.test'）。每个（函数（）{
var test=$（this.val（）；
警报（测试）；
$（“URL:+test+”）.appendTo（$（'#urlnm'））；
});
});
});

添加更多
您应该使用
.empty（）
清除div的内容，然后使用
.append（）


$（函数（）{
$（'.addurl'）。单击（函数（）{
$（'.more'）.add（''）.appendTo（'.more'）；
});
$（'.more'）.on（'change'，'.test'，function（）{
var container=$（'#urlnm'）.empty（）；
$（'.test'）。每个（函数（）{
//如果要使用id，请创建一个机制，以便标识符必须是唯一的
$（“URL:+$（this.val（）+）.appendTo（container）；
});
});
});

添加更多
您应该使用
.empty（）
清除div的内容，然后使用
.append（）


$（函数（）{
$（'.addurl'）。单击（函数（）{
$（'.more'）.add（''）.appendTo（'.more'）；
});
$（'.more'）.on（'change'，'.test'，function（）{
var container=$（'#urlnm'）.empty（）；
$（'.test'）。每个（函数（）{
//如果要使用id，请创建一个机制，以便标识符必须是唯一的
$（“URL:+$（this.val（）+）.appendTo（container）；
});
});
});

添加更多
添加了一个“更干净”的版本，IMHO


第一次输入后显示结果
实际上，您可以删除
more
类框
删除div
change
事件处理

奖金：


同步所有输入文本框上的更改


$（函数（）{
$（'.addurl'）。单击（函数（e）{
//清除结果框
$（“#结果”）.empty（）；
//读取所有输入文本框并显示结果
$（“#box input.test”）。每个（函数（）{
var inputValue=$（this.val（）；
addOutputBox（inputValue）；
});
//添加输入文本框
$（“
”）。附加到（“#框输入”）；
});
函数addOutputBox（urlValue）{
$（“URL:+urlValue+”）.appendTo（“#result”）；
}
//即使在所有文本框上也能处理输入
$（“#框输入”）。关于（“输入”，“测试”，函数（e）{
//log（“changes”，currentIndex，$（this.val（））；
var totalOutput=$（“#result.output”）.length；
var totalInput=$（“#box input.test”）.length；
如果（totalOutput==0 | | totalOutput



添加更多
添加了一个“更干净”的版本，IMHO


第一次输入后显示结果
实际上，您可以删除
more
类框
删除div
change
事件处理

奖金：


同步所有输入文本框上的更改


$（函数（）{
$（'.addurl'）。单击（函数（e）{
//清除结果框
$（“#结果”）.empty（）；
//读取所有输入文本框并显示结果
$（“#box input.test”）。每个（函数（）{
var inputValue=$（this.val（）；
addOutputBox（inputValue）；
});
//添加输入文本框
$（“
”）。附加到（“#框输入”）；
});
函数addOutputBox（urlValue）{
$（“URL:+urlValue+”）.appendTo（“#result”）；
}
//即使在所有文本框上也能处理输入
$（“#框输入”）。关于（“输入”，“测试”，函数（e）{
//log（“changes”，currentIndex，$（this.val（））；
var totalOutput=$（“#result.output”）.length；
var totalInput=$（“#box input.test”）.length；
如果（totalOutput==0 | | totalOutput



添加更多
请发布id的HTML
urlnm
too@AlivetoDie我已经将其添加到代码片段中，我只能假设这是OP的意图。@Terry我认为您必须恢复这两个更改，并让OP放入自己的HTML和脚本代码。那里更改代码并将其添加到OP的问题中是非常糟糕的，因为它改变了问题的整个结构/含义。请将其还原为originalI除了将其移植到代码段并添加ID为
urlnm
的div之外，没有做任何更改。如果你认为这很糟糕，我相信你有机会回过头来：不去反驳。作为一名执行官。事实上，答案正是我所需要的。非常感谢@Satpalplease发布id
urlnm的HTMLtoo@AlivetoDie我已经将其添加到代码片段中，我只能假设这是OP的意图。@Terry我认为您必须恢复这两个更改，并让OP放入自己的HTML和脚本代码。那里更改代码并将其添加到OP的问题中是非常糟糕的，因为它改变了问题的整个结构/含义。请将其还原为originalI除了将其移植到代码段并添加ID为
urlnm
的div之外，没有做任何更改。如果你认为这很糟糕，我相信你有机会回过头来：不去挑战它。作为一名执行官。事实上，