Question

我的代码如下：

function getRowMarkup(rowNo) {
  return '<tr class="row" data-row-no="'+rowNo+'"> \
    <td class="row-no">'+rowNo+'.</td> \
    <td><input type="text" name="ItemUnit_'+rowNo+'" class="item-unit" /></td> \
    <td><input type="text" name="ItemUnit_'+rowNo+'" class="item-unit" /></td> \
    <td><input type="text" name="ItemUnit_'+rowNo+'" class="item-unit" /></td> \
    <td><input type="number" name="ItemUnit_'+rowNo+'" class="item-unit" id="jeden'+rowNo+'"/></td> \
    <td><input type="number" name="ItemUnit_'+rowNo+'" class="item-unit" id="dwa'+rowNo+'"/></td> \
    <td><div  class="item-unit" id="trzy'+rowNo+'"/></div></td> \
    <td><a href="javascript:void(0);" class="delete-row">Delete</a></td> \
    </tr>';
}

此功能正常运行并在表格中添加新位置。我希望有一个按钮来计算输入，其中包含id =＆＃34;＆＃34; jeden＆＃39; + rowNo +＆＃39;＆＃34;＆＃34;和id =＆＃34; dwa＆＃39; + rowNo +＆＃39;＆＃34;并以div =＆＃34; trzy＆＃39; + rowNo +＆＃39;＆＃34;显示我在div中的分数。如何修复下面的代码以获取getElementById中的变量id。正如你可能想象的那样，id在添加新行后会发生变化，它们会有下一个数字，所以它就是例如：jeden1，jeden2，jeden3等。如何将这些变量id放入我的代码中。

function numberMult() {
  var firstNumber = Number(document.getElementById("jeden"+"rowNo").value);
  var secondNumber =Number(document.getElementById("dwa"+"rowNo").value);
  var result = firstNumber * secondNumber
  document.getElementById("trzy"+"rowNo").innerHTML = result;
};

感谢您的帮助。

Answer 1

1）你不能用getElementById引用几个id。它返回由id选择的单个元素。也许你会对querySelectorAll

感兴趣

2）rowNo是一个变量，你的实际标记是用这个变量的值生成的，所以你可能会有像id="jeden0"，id="jeden1"等的ID ......

3）在您的函数numberMult中，您需要传递变量rowNo，就像getRowMarkup

一样

4）然后使用此变量选择元素。类似的东西：

function numberMult(rowNo) {
  // do not use quotes for variable
  var firstNumber = Number(document.getElementById("jeden"+rowNo).value);
  var secondNumber =Number(document.getElementById("dwa"+rowNo).value);
  var result = firstNumber * secondNumber
  document.getElementById("trzy"+rowNo).innerHTML = result;
};

在一个命令getElementById中引用几个id

1 个答案: