Question

我有一个允许用户添加过去雇主的表单。用户可以按下按钮并动态添加新雇主。

以下是我需要做的事情：假设用户增加了2个雇主。我需要先添加每项工作所花费的年数 -

EX：雇主1 - 2005 - 2007 = 2年。雇主2 - 2010 - 2015 = 5年。

现在，我需要总共EX：7年。

表单字段的名称如下：

ID1_empAppWorkHistoryStartDateYear ID1_empAppWorkHistoryEndDateYear

ID2_empAppWorkHistoryStartDateYear ID2_empAppWorkHistoryEndDateYear

如何在JavaScript中循环动态输入名称并计算在所有作业上发送的总年数（最多可以有5个）

Answer 1

如果您只是在输入时将输入的值存储在变量中，该怎么办？您可能需要由 HTML表单事件触发的功能？ https://www.w3schools.com/tags/ref_eventattributes.asp

在提交时，如果不是更早，您可以计算差异并将其添加到存储总年数的任何地方:)。

Answer 2

知道您将每个添加的输入命名为以下形式：

第一次输入：

IDX_empAppWorkHistoryStartDateYear

对于第二个输入：

IDX_empAppWorkHistoryEndDateYear

其中X是输入的编号。

首先应该添加一个全局变量，该变量将包含添加的输入数量（每次用户添加雇主时都会增加），让我们将其命名为glbInputsNumber

您的代码如下：

var totalYears = 0;
for (let i = 0; i < glbInputsNumber; i++) {
totalYears += parseInt(document.getElementsByName('IDX_empAppWorkHistoryEndDateYear'.replace('X', i)).value) - parseInt(document.getElementsByName('IDX_empAppWorkHistoryStartDateYear'.replace('X', i)).value);
}

编辑：如果您对全局变量不满意，可以对所有这些输入使用公共类名称，这样您就可以获得添加的输入数量，如下所示：

var myobject = document.getElementsByClassName('dateInput');//'dateInput' is the name of class that will be attributed to those added inputs
var inputsNumber = myobject.length / 2;

增加动态表单字段

2 个答案: