Javascript getElementsByName() 用于更改名称

Question

我有一个自动呈现的 HTML 表单，它使用输入字段的索引。

数量:

<input id="id_orderline_set-0-orderline_quantity" name="orderline_set-0-orderline_quantity" onkeyup="orderlineTotal()" type="number" value="120"> 

产品价格；

<input id="id_orderline_set-0-orderline_product_price" name="orderline_set-0-orderline_product_price" onkeyup="orderlineTotal()" type="number" value="22">

总行价格；

<input id="id_orderline_set-0-orderline_total_price" name="orderline_set-0-orderline_total_price" tag="orderline_total_price" type="number" value="2640">

对于以下几行，id 和名称的索引增加，仅显示数量示例；

<input id="id_orderline_set-1-orderline_quantity" name="orderline_set-1-orderline_quantity" onkeyup="orderlineTotal()"  type="number" value="55">

我想使用以下 JavaScript 来计算总行价格；

function orderlineTotal()
{
    var orderlineTotalPrice = 0;   
    var theForm = document.forms["orderform"];

    var orderlineQuantityField = theForm.getElementsByName["orderline_quantity"];
    var orderlineProductPriceField = theForm.getElementsByName["orderline_product_price"];
    var orderlineTotalPriceField = theForm.getElementsByName["orderline_total_price"];

    for (var i = 0; i < orderlineQuantityField.length; i ++) {
        orderlineTotalPrice = orderlineQuantityField[i].value * orderlineProductPriceField[i].value;
        orderlineTotalPriceField[i].value = orderlineTotalPrice;
    }
}

当然这不会起作用，因为元素的名称不匹配。我可以使用部分名称查找元素的名称吗？如果不是，我应该如何循环输入框来计算行总数？

Answer 1

您标记了 jQuery，因此如果您想使用 jQuery，您可以使用带有选择器的结尾:

$("input[name$='orderline_quantity']")

ends with

还有

starts with

$("input[name^='id_orderline_set-0']")

和contains

$("input[name*='orderline_']")