javascript - 警报总是打印相同的值，尽管它应该在循环中增加

Question

for ( i = 1; i <= NumOfText; i++ ) {
    var ipBoxName="MyInput"+i;
    var txtBoxAutoNumbering="<input type='text' name='textbx[]' id='TxtBx'  style='width:50px;' value="+i+" />&nbsp;&nbsp;&nbsp;";

    $('#NewlyCreatedSelectBoxes').append(txtBoxAutoNumbering);

    var txtBox="<input type='text' name='textbx[]'/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"
    $('#NewlyCreatedSelectBoxes').append(txtBox);

    var Select_SelectionOptions="<select id='SelectOption'><option>Text_Box</option> <option>Text_Area</option><option>Radio_Button</option></select>&nbsp;&nbsp;&nbsp;";
    $('#NewlyCreatedSelectBoxes').append(Select_SelectionOptions);
    var c = document.getElementById("TxtBx").value;
    alert(c);
    var Select_For_Multiple_Choices="<button type='button' onclick='ChildTxtBoxes()' id='Child_Btn'"+i+">Click for child selections</button><br><br>";      
    $('#NewlyCreatedSelectBoxes').append(Select_For_Multiple_Choices);
}

在这里，我已经发出警报以打印由“var txtBoxAutoNumbering”变量表示的文本框的值。Bt 它总是打印 1 虽然它运行。是吗？

Answer 1

您正在创建具有相同 ID 的多个元素。这是无效的 HTML。作为副作用，当您尝试通过 ID 获取它们时，您只会得到您创建的第一个。

请尝试以下操作：

var txtBoxAutoNumbering="<input type='text' name='textbx[]' id='TxtBx" + i +"'                 style='width:50px;' value="+i+" />&nbsp;&nbsp;&nbsp;";

和

var c=document.getElementById("TxtBx" + i).value;