jquery - jQuery - 填写表单输入的计数器（即时更新）

Question

我有基本的订单表（4 个输入仅用于测试目的），我想计算输入值（总项目）的数量，其中值被填写并高于 0（基本上订购了多少产品，不要与它们的数量混淆） . 当我添加产品很好时，当我删除项目时问题开始（将它们设置为 0）。你能帮我解决一下吗。

工作jsfiddle：http: //jsfiddle.net/nitadesign/97tnrepg/33/

几行代码可以将您的注意力吸引到正确的位置：

function GetOrder(curId){
var order = null;

for(i = 0; i< orders.length; i++){
     if(orders[i].id == curId){
        order = orders[i];
        break;
    }
}

return order;
}

function CalculateTotal(){
var total = 0;
for(i = 0; i< orders.length; i++){
    total = total + orders[i].packTotal;
}
console.log(total);

if(total > 0){
    $("#order_total").html('Total Items:' + i + '<br>' + 'Order Subtotal: ' + total);
    $("#order_total").show();
    $('.submitorder').show();
}
if(total == 0){
    $("#order_total").html('Your shopping basket is empty');
    $("#order_total").show();
    $('.submitorder').hide();
}
}

非常感谢您提前提供的帮助！

Answer 1

只需使用一个 jquery 选择器并循环它。

$("input").change(function(){
    var counter = 0;
    $("input").each(function(){
        if($(this).val() != "" && $(this).val() != 0) counter++;
    });

    $("#order_total").html('Total Items:' + counter + '<br>' + 'Order Subtotal: ' + total);
});

Answer 2

if(total > 0){
    var counter = 0;  
    $("input[type=text]").each(function(){
    if($(this).val() != "" && $(this).val() != 0) counter++;
    });
    $("#order_total").html('Total Items:' + counter + '<br>' + 'Order Subtotal: ' + total);
    $("#order_total").show();
    $('.submitorder').show();
}
if(total == 0){
    $("#order_total").html('Your shopping basket is empty');
    $("#order_total").show();
    $('.submitorder').hide();
}