Javascript 如何根据用户输入创建自动表单生成器

我正在尝试创建一个表单，它将根据用户输入生成不同级别的表单

这方面的一个例子是 “有多少个级别？”-用户输入3- 将生成三个单独的级别，每个级别都有相同的问题。在这里，会有一个问题问“有多少个对象？”这里也会发生同样的情况，即会生成多个选项

我在这方面遇到的问题是分配ID，然后能够获取它们，以便它们可以被引用以供以后使用和MySQL

function generateForm(){
var number = document.getElementById('number_of_levels').value;
var div = document.getElementById('levels');
//  div.innerHTML += " " +number;

var heading = document.createElement("P");
heading.innerHTML = "Level " + number;    
document.getElementById('levels').appendChild(heading);

var objects = document.createElement("P");

objects.innerHTML = "How many objects is the badge comprised of?";        
document.getElementById('levels').appendChild(objects);

var num_objects_input = document.createElement("input");
num_objects_input.type = "number";
num_objects_input.id = "number_objects" +number;
document.getElementById('levels').appendChild(num_objects_input);



//num_objects.onchange = function(){addObject(num_objects.id)};  

//div for the following levels
var ind_levels_div = document.createElement("div");
ind_levels_div.id = "level_" +number;
document.getElementById('levels').appendChild(ind_levels_div);
num_objects_input.onchange = function(){additionalObject()};

}


function additionalObject(){
var number = document.getElementById("number_objects" +number).value;

var objects_number = document.createElement("P");
    objects_number.innerHTML = "Object " + number;    
    document.getElementById("level_" +number).appendChild(objects_number);
}

---

我得到的结果是表单不会生成任何对象表单元素，但会生成级别。

对于构建表单，此代码可以很好地工作。如果您想要检索数据，那么您应该添加一个name属性来检索您想要检索的数据

函数generateForm（）{
var数=0；
number=document.getElementById（'number\u of \u levels'）。值；
var div=document.getElementById（'levels'）；
//div.innerHTML+=“”+编号；
如果（数字>0）{
document.getElementById（'levels_btn'）.setAttribute（'disabled'，'disabled'）；
}
for（让索引=0；索引

.levels{
左侧填充：20px；
}
.U级对象{
左侧填充：40px；
}

级别
水平



提交表格

很难理解您的意图。你能做一些演示吗，或者一个html文件，其中包含你想要获得的一些

级别
值的输出吗？@Joe先生，我添加了一个图片，希望能更好地解释它。请提供初始html，这也非常适合我的需要，我面临的问题是避免使用按钮，但我遇到了无法返回并获取不同ID的问题。这就避免了，所以谢谢你！