onchange of textbox将添加相应的文本框jquery

时间:2015-03-06 10:48:47

标签: javascript jquery

$('.floor').change(function() {
    var floor1 = parseInt($('#firstfloor').val(), 10);
    var floor2 = parseInt($('#secondfloor').val(), 10);
    var floor3 = parseInt($('#thirdfloor').val(), 10);
    var floor4 = parseInt($('#fourthfloor').val(), 10);

    var storey = $('#nostorey').val();
    alert(storey);
    if(storey === 1){
        var total = floor1;
    }else if(storey === 2){
        var total = floor1 + floor2;
    }else if(storey === 3){
        var total = floor1 + floor2 + floor3;
    }else{
        var total = floor1 + floor2 + floor3 + floor4;
    }



    console.log(total);
    $('#area_total').val(total);
    });

我有5个输入on for determining the number of floors1 for each floor我希望通过根据楼层数添加每个楼层的面积来获得建筑物的总面积。我所做的是获取建筑物的楼层价值或数量,然后根据我有if语句的值来添加要添加的楼层。除了给出所有4个输入值之外,其余的将给出NaN作为结果。任何想法都表示赞赏。

UPDATE

FIDDLE

2 个答案:

答案 0 :(得分:0)

删除所有ifs并将所有区域加起来:

$('.floor').change(function() {
  var floor1 = parseInt($('#firstfloor').val(), 10) || 0;
  var floor2 = parseInt($('#secondfloor').val(), 10) || 0;
  var floor3 = parseInt($('#thirdfloor').val(), 10) || 0;
  var floor4 = parseInt($('#fourthfloor').val(), 10) || 0;
  var total = floor1 + floor2 + floor3 + floor4;

  console.log(total);
  $('#area_total').val(total);
});

答案 1 :(得分:0)

最好为您的输入添加一些类,例如 .floor-input ,然后执行

// values of your floors will store in this array
var values = [];

// get floor values
$('.floor-input').each(function() {
    values.push(parseInt($(this).val(), 10) || 0);
});

// get sum of all floors
var total = values.reduce(function(sum, val) {
    return sum + val;
}, 0);
console.log(total);

现在您可以添加任意数量的楼层而无需更改代码