我可以使用jquery .each()来计算表单中的每一行吗?

Can I use jquery .each() to calculate each row in a form?

本文关键字:一行 计算 可以使 jquery each 我可以 表单      更新时间:2023-09-26

我正在创建一个表单,它将计算项目每行的总数。

我已经使用了一块javascript单独计算每一行,但我想知道我是否可以使用。each()来计算每一行相同的类,而不是有一个脚本的每一行有一个唯一的ID。

脚本应该是:(类为"price1"的p元素中的价格)*(类为"qty1"的输入元素中的值)。结果需要通过类"total1"

进入输入元素。

我的网页是http://www.catering-equipment.co.uk/portal1/我在这里创建了一个JSFiddle -> https://jsfiddle.net/1y7kudtv/4/

$(".qty1").on('keyup', function () {
    // alert('pressed')
    var total = $(".price1").html() * $(this).val()
    $(".total1").val(total);
})

你可以看到我在javascript代码的尝试,但它只会工作,如果我使用唯一的ID,而不是一个类。

提前感谢。

使用.closest():

$(this).closest('.itemrow').find('.total1').val(total);
演示

可以。使用find只查找当前选择器中的元素:

$('.itemrow').each(function() {
    var price = $(this).find('.price1').html();
    var quantity = $(this).find('.qty1').val();
    var total = price * quantity;
    $(this).find('.total1').val(total);
});

还要注意,这里处理的是浮点运算,所以最好将总数四舍五入,以避免显示10.99999999:

这样的内容。
var total = (price * quantity).toFixed(2);