Javascript jquery循环以添加输入字段

我的代码的第一部分工作得很好。它让用户输入一个班级的学生人数，点击submit，然后根据他们的输入返回一个响应。当用户在第一步中点击submit时，我还试图让下一步出现。我需要第一步（

numberOfStudents

）中的数字来创建文本字段和每个学生的下拉列表。（

firstName

、

lastName

和

studentLevel

）。例如：用户输入24并点击提交。获取响应“您将有6个4人小组。”第二步显示24个实例，分别是

firstName

、

lastName

、和

studentLevel

输入字段，最后有一个提交按钮。现在，除了创建24（x3）个输入字段的

studentList

循环之外，其他一切都在工作。 这也是使用引导。 我对编码比较陌生，所以请详细解释：）

在等待响应时，我还尝试了do While循环，这将抛出3个输入字段的一个实例。它似乎不喜欢以i

$（“#团队表单”）。提交（功能（事件）{
event.preventDefault（）；
const numberOfStudents=parseInt（$（“#numberOfStudents”）.val（）；
让responseHTML='
'；
如果（numberOfStudents%4==0）{
responseHTML+=“你的班上将有“+numberOfStudents/4+”个4人小组。”；
}否则如果（numberOfStudents%4==1）{
responseHTML++=“您将有”+（numberOfStudents-1）/4个+”团队，每个团队4人，一个团队5人。”
}否则如果（numberOfStudents%4==2）{
responseHTML++=“你的班级将有“+（numberOfStudents-6）/4+”个4人小组和两个3人小组。”
}否则{
responseHTML++=“您将有”+（numberOfStudents-3）/4个+”团队，每组4人，一组3人。”
}
响应HTML+='
'
$（'studentNumberResponse'）.css（'display'，'block'）.html（responseHTML）；
$（'numberOfStudents'）.val（''；
}).提交（功能（事件）{
event.preventDefault（）；
const numberOfStudents=parseInt（$（“#numberOfStudents”）.val（）；
让responseHTMLSecond='步骤2：输入学生
添加学生以创建每个团队。
'；
let studentList='选择学生级别高-中-高-中-低'；
for（设i=0；i
*{
框大小：边框框；
}
#学生号响应，
#第二步，
#学生列表反应{
显示：无；
}

OnPoint团队生成器
OnPoint团队生成器
步骤1：团队数量
你们班有多少学生
提交
我查看了您的代码。问题是，附加html的for循环没有执行，这是因为下面的一行。当您清除文本框时，您将无法再次设置NumberOfStudents变量。我已经修好了。这是JSFIDLE-->

清除文本框后，您试图使用下面的行设置变量

const numberOfStudents = parseInt($("#numberOfStudents").val());

由于这个原因，你的循环没有运行，你的html也没有按你希望的方式连接起来。
按照上面的建议工作。-我想和大家分享一下，以防对其他人有所帮助


$（“#团队表单”）。提交（功能（事件）{
event.preventDefault（）；
const numberOfStudents=parseInt（$（“#numberOfStudents”）.val（）；
让responseHTML='
'；
如果（numberOfStudents%4==0）{
responseHTML+=“你的班上将有“+numberOfStudents/4+”个4人小组。”；
}
否则如果（numberOfStudents%4==1）{
responseHTML++=“您将有”+（numberOfStudents-1）/4个+”团队，每个团队4人，一个团队5人。”
}
否则如果（numberOfStudents%4==2）{
responseHTML++=“你的班级将有“+（numberOfStudents-6）/4+”个4人小组和两个3人小组。”
}
否则{
responseHTML++=“您将有”+（numberOfStudents-3）/4个+”团队，每组4人，一组3人。”
}
响应HTML+='
'
$（'studentNumberResponse'）.css（'display'，'block'）.html（responseHTML）；
}).提交（功能（事件）{
event.preventDefault（）；
const numberOfStudents=parseInt（$（“#numberOfStudents”）.val（）；
让responseHTMLSecond='步骤2：输入学生
添加学生以创建每个团队。
'；
设i=0；
做{
i++；
responseHTMLSecond+=“学生”+i+”；
responseHTMLSecond+=“选择学生级别高-中-高-中-低”；
}而（我是学生）；
responseHTMLSecond+=“完成添加所有学生后，单击提交按钮。”；
$（'secondsStep'）.css（'display'，'block'）.html（responseHTMLSecond）；
$（'numberOfStudents'）.val（''；
});
*{
框大小：边框框；
}
#学生编号响应，#第二步，#学生列表响应{
显示：无；
}

OnPoint团队生成器
OnPoint团队生成器
步骤1：团队数量
你们班有多少学生
提交
这里有几个问题，我将尝试按顺序解决每个问题

parseInt
如果没有基数，可能会产生意外的结果。见f
const numberOfStudents = parseInt($("#numberOfStudents").val());

const numberOfStudents = parseInt($("#numberOfStudents").val());

const numberOfStudents = parseInt($("#numberOfStudents").val(), 10);

// for example
const remainder = numberOfStudents % 4;
let responseHTML = '<p class="responseText">';
if (remainder === 0) {/*...*/}

$('#numberOfStudents').val('');

const numberOfStudents = parseInt($("#numberOfStudents").val()); // NaN