Question

我正在尝试对我的表单进行实时计算，请查看表单...

<input type="text" value="0" name="product1" class="num"/>
<input type="text" value="0" name="product2" class="num" />
<input type="text" value="0" name="product3" class="num"/>
<input type="text" value="0" name="cost" class="cost"/>

和jquery代码......

$(function() {
var cost = 0;
$('.num').blur(function(){
cost+= parseFloat($(this).val());
});
$('.cost').val(cost);
});

但它不起作用，请帮助谢谢。

Answer 1

您需要移动更新模糊事件处理程序中费用字段值的行：

<强>更新通过使用这种修改值将导致总数不断添加的方法，逻辑也存在问题，我修改了代码来解决这个问题：

$(function() {
    $('.num').live("blur", function(){
        var parentLI = $(this).closest("LI");
        var cost = 0;
        $(".num", parentLI).each(function() {
            var value = $(this).val();
            if (!isNaN(value) && value != "")
                cost+= parseFloat(value);
        })
        $('.cost').val(cost);
    });
});

Answer 2

只需将$('.cost').val(cost);移动到模糊功能中，或者仅在加载页面时运行模糊功能时才会运行。

所以这应该有效：

$(function() {
  var cost = 0;
  $('.num').blur(function(){
      cost+= parseFloat($(this).val());
      $('.cost').val(cost);
  });
});

Answer 3

您可能希望为文档元素使用id而不是name，并使它们唯一。

您的代码应如下所示：

$(function() {
  var cost = 0;
  $('.num').blur(function(){
     cost+= parseFloat($(this).value());
     $('.cost').value(cost);
  });
});

请注意如何更容易地看到缩进问题。成本字段值的变化并不恰当。

Answer 4

将jQuery的代码更改为，$('.cost').val(cost);从未被调用，因为它是在模糊事件函数之外写的...所以控件在函数中就不会去那里

$(function() {
var cost = 0;
$('.num').blur(function(){

//EDIT
$('.cost').val(parseFloat($('.cost').val())+parseFloat($(this).val()));

});
$('.cost').val(cost);
});

并且还在HTML文本框中使用value属性而不是val ..

Answer 5

您还可以使用更改（fn）而不是模糊，以避免在未更改值时进行不必要的计算。 .keyup（fn）允许您在用户输入时执行此操作。希望有所帮助！

Answer 6

这是因为你使用'val'而不是'value'

Jquery：计算模糊事件的值

6 个答案: