javascript - JavaScript中输入数组不同怎么办？

Question

我现在正在学习 JavaScript，对于语法和 DOM 操作来说都是一项全新的任务。

现在我并没有真正使用 jQuery(或任何其他库)。我以前用过它，但现在不感兴趣，因为我想掌握它的窍门，然后再去图书馆。我正在寻找不涉及库的纯 JavaScript 示例。

<form name="carritoDeCompras" action=""> 
 <table width="100%" border="0">
  <tr>
    <td width="17%">Nombre de Articulo </td>
    <td width="22%">Precio</td>
    <td width="51%"> Cantidades</td>
  </tr>
  <tr>
    <td>Desktop</td>
    <td><input name="price[]" type="text" disabled="disabled" value="1900.00" id="1 "/></td>
    <td><input name="cantidad[]" type="text" value="4" id="1 cantidad" /></td>
  </tr>
  <tr>
    <td>Monitor</td>
    <td><input name="price[]" type="text" disabled="disabled" value="322.00" id="2" /></td>
    <td><input name="cantidad[]" type="text" value="2" id="2 cantidad" /></td>

  </tr>
  <tr>
    <td>Disco Duro</td>
    <td><input name="price[]" type="text" disabled="disabled" value="244.33" id="3"/></td>
    <td><input name="cantidad[]" type="text" value="10" id="3 cantidad" /></td>
  </tr>
  <tr>
    <td>Mouse</td>
    <td><input name="price[]" type="text" disabled="disabled" value="100.21" id="4"/></td>
    <td><input name="cantidad[]" type="text" value="100" id="4 cantidad" /></td>
  </tr>
</table>
</form>

我的目标是将价格和数量 (cantidad) 分开，并使用“更新价格”按钮将它们相加。这让我对如何获取那些“price[]”“cantidad[]”输入并将它们分开感到疑惑，这样我就可以创建一个循环并很好地进行数学计算。

抱歉西类牙语/英语混用，妨碍了您，

Answer 1

您需要使用 document.getElementsByName

var prices = document.getElementsByName("price[]");
var quantities = document.getElementsByName("cantidad[]");

IE 的文档和 MDC (火狐)。

如果您需要迭代方面的帮助:

var totalPrice    = 0,
    totalQuantity = 0,
    i;

i = prices.length;
while ( i-- ) { totalPrice    += +prices[i]     || 0; }

i = quantities.length;
while ( i-- ) { totalQuantity += +quantities[i] || 0; }

+prices[i] 中的 + 将值转换为整数。 || 0 是确保只返回数字。如果 prices[i] 是像“asdf”这样的字符串，+"asdf" 的计算结果为 NaN，这意味着 totalPrice += NaN 也将是 NaN。但是，NaN || 0 的计算结果为 0，因此您可以避免此问题。