Javascript JQuery不会再次循环遍历元素

我有以下代码：

for(counter = 0; counter < 2; counter++) {
    $form = $("<form></form>");
    $form.append($('.mandatory-form-input'));

    if(counter == 0) {
        $form.append($('.upload_box:lt(10)'));
    } else {
        var start_point = (counter * 10) - 1;
        $form.append($('.upload_box:gt('+ start_point +'):lt(10)'));
    }

    console.log($form.html());
}

for（计数器=0；计数器<2；计数器++）{
$form=$（“”）；
$form.append（$（'.mandatory form input'）；
如果（计数器==0）{
$form.append（$（'.upload_box:lt（10）'）；
}否则{
var起始点=（计数器*10）-1；
$form.append（$（'.upload_box:gt（'+start_point+）：lt（10））；
}
log（$form.html（））；
}

我想要实现的逻辑是，它应该创建一个表单，添加所有必需的输入，然后在部件上添加输入（基于css，

lt

，

gt

东西）

但这并不像预期的那样工作，在第一次迭代时，它工作正常，但在第二次迭代时，它并没有记录任何东西。我不知道为什么。。。（至少它应该显示添加的

强制表单输入

字段，我正在添加），但它甚至没有显示

我想问，我的代码中是否缺少一些东西？（比如，重置某个$reference或其他东西的方法？）

---

注意：我尝试在循环结束时清除$form变量，但仍然不起作用…

因为您要附加相同的元素

$（'.mandatory form input'）

，然后从现有位置删除原始元素并添加到新的

$form

对象

您可以选择目标元素，然后附加它们

创建匹配元素集的深度副本

for（计数器=0；计数器<2；计数器++）{
$form=$（“”）；
$form.append（$（'.mandatory form input'）.clone（）；//受影响的行
....
log（$form.html（））；
}

由于您要追加相同的元素

$（'.mandatory form input'）

，因此原始元素将从现有位置删除并添加到新的

$form

对象中

您可以选择目标元素，然后附加它们

创建匹配元素集的深度副本

for（计数器=0；计数器<2；计数器++）{
$form=$（“”）；
$form.append（$（'.mandatory form input'）.clone（）；//受影响的行
....
log（$form.html（））；
}

你能更详细地解释一下为什么没有克隆它就不能工作吗？@Aayussinha你是在多个表单中添加同一个元素，所以当在元素中添加同一个元素时，你只是添加了一个位置，这意味着原始元素从现有表单移到了新表单中？@Aayussinha YesAh，我明白了。谢谢。你能更详细地解释一下为什么没有克隆它就不能工作吗？@Aayussinha你是在多个表单中添加同一个元素，所以当在元素中添加它时，你只是在元素中添加了一个位置，这意味着原始元素从现有表单移到了新表单中？@Aayussinha YesAh，我明白了。谢谢

for(counter = 0; counter < 2; counter++) {
    $form = $("<form></form>");
    $form.append($('.mandatory-form-input').clone()); //Affected line

    ....
    console.log($form.html());
}