Javascript 字符串没有获得连接的变量值？

Question

在 HTML 表单中，我使用 jquery/javascript 创建动态 HTML 元素。为了给动态元素提供不同的 ID，我使用了循环迭代变量。我的想法是使用循环，它会自动给出迭代编号作为 ID，但在 HTML 中我看到它对所有元素使用第一个迭代数字值。

例如，如果我传递 2，它会生成 2 个具有相同 ID 的控件。这是为什么？对我来说，JS 的这种行为很奇怪。您能指导一下是什么原因造成的吗？循环适用于传递给函数的次数，但它没有将正确的数字显示为 ID 的一部分。

  function CreateDependentForms(noOfControlsToCreats)
    {
        var itrator = 1;
        var sectionFName ="<div id=Dependent"+ itrator +"FName " +"class=\"field rf-field\"><label>First Name</label><input type=\"text\" required=\"\" placeholder=\"eg. Joe\" name=\"partNerfirstname\" aria-required=\"true\"></div>";

        for (;itrator<noOfDependents; itrator++)
        {               
            alert(sectionFName);
            $('#dependentfrequency').after(sectionFName);
        }
}

Answer 1

创建 HTML 内容的部分不在循环之外。在循环内移动 varsectionFName 的声明将为您的元素生成唯一的 ID。

function CreateDependentForms(noOfControlsToCreats) {
    for (var itrator = 1; itrator < noOfDependents; itrator++) {               
        var sectionFName ="<div id=Dependent"+ itrator +"FName " +"class=\"field rf-field\"><label>First Name</label><input type=\"text\" required=\"\" placeholder=\"eg. Joe\" name=\"partNerfirstname\" aria-required=\"true\"></div>";

        $('#dependentfrequency').after(sectionFName);
    }
}