1

我有一个表,我试图在其中使用 jQuery on keydownor来添加和减去多个文本字段blur。虽然我可以成功添加,但我得到所有错误的减法结果。

HTML:

<input type="text" class="add" />
<input type="text" class="add" />
<input type="text" class="sub" />
<input type="text" class="sub" />
<label id="total"></label>

JS:

 $('.add').blur(function () {
     var sum = 0;
     $('.add').each(function () {
         if (!isNaN(this.value) && this.value.length != 0) {
             sum += parseFloat(this.value);
         }
     });

     $('#total').text(sum.toFixed(2));

 });

 $('.sub').blur(function () {
     var sum = 0;
     var val = $('#total').text();
     $('.sub').each(function () {
         if (!isNaN(this.value) && this.value.length != 0) {
             sum -= parseFloat(this.value);

         }
     });
     val = parseFloat(sum) - parseFloat(val);
     $('#total').text(val);

 });

小提琴

4

6 回答 6

3

我建议下一个解决方案:

HTML:

<input type="text" class="calc" data-action="add" />
<input type="text" class="calc" data-action="add" />
<input type="text" class="calc" data-action="sub" />
<input type="text" class="calc" data-action="sub" />
<label id="total"></label>

JS

$(document.body).on('blur', '.calc', function() {
    var result = 0;
    $('.calc').each(function() {
        var $input = $(this),
            value = parseFloat($input.val());

        if (isNaN(value)) {
            return;
        }

        var action = $input.data('action') == 'add' ? 1 : -1;

        result += value * action;
    });

    $('#total').text(result.toFixed(2));
});

试试看

于 2013-08-30T20:36:40.873 回答
3

改变:

val =  parseFloat(sum) - parseFloat(val);

至:

val =  parseFloat(val) + parseFloat(sum);

.sub处理程序中,sum是负数,因此您需要将其添加val到减去。

小提琴

于 2013-08-30T20:36:57.387 回答
1

最短版本的 jquery 可以做你想做的事......真的很鼓舞人心。

http://jsfiddle.net/techsin/QHgdZ/5/

var total, f=$('#total'), s=$('.calc');
s.blur(function(){
    var t=$(this),total=0;
    t.data('i',t.val()*((t.data('action')=='sub')?-1:1));
    s.each(function(){total+=~~$(this).data('i');});
    f.text(total);});

是的,这就是所有代码...

于 2013-08-30T22:37:50.923 回答
1

根据您的小提琴,您可以简单地执行以下操作:

$(function() {
    $(document).on('blur change keyup', '.add, .sub', function(e) {
        var sum = 0;
        $('.add, .sub').each(function(i) {
            if (!isNaN(this.value) && this.value.length != 0) {
                if ($(this).hasClass('add')) {
                    sum += parseFloat(this.value);
                }
                else {
                    sum -= parseFloat(this.value);
                }
            }
        });
        $('#total').text(sum.toFixed(2));
    })
})

例子

有趣的版本!¡!

于 2013-08-30T20:41:13.340 回答
1

这个怎么样:

http://jsfiddle.net/fYSgn/

我结合了这两个模糊功能

function parseOrZero(val){
    return parseFloat(val) || 0;
}
$('.add, .sub').blur(function () {
    var total = 0;
    for(i =0, as = $(".add, .sub"), asl = as.size(); i < asl; i++){
        if(i < 2){
            total += parseOrZero(as.eq(i).val());
        }else{
            total -= parseOrZero(as.eq(i).val());
        }
    }     
    $('#total').text(total);
});
于 2013-08-30T20:42:52.853 回答
0
<html>
<head>
<script language="javascript">
function Sum()
{
var num1,num2,res;
num1=document.getElementById("txtnum1").value;
num2=document.getElementById("txtnum2").value;
res=parseInt(num1)+parseInt(num2);
document.getElementById("txtres").value=res;
}

function Subtract()
{
var num1,num2,res;
num1=document.getElementById("txtnum1").value;
num2=document.getElementById("txtnum2").value;
res=num1-num2;
document.getElementById("txtres").value=res;
}



</script>
</head>
<body>
<table align="center">
<tr>
<td>Num1</td>
<td><input id="txtnum1" onChange="Sum()" /></td>
</tr>
<tr>
<td>Num2</td>
<td><input id="txtnum2" onChange="Sum()"  /></td>
</tr>
<tr>
<td>Result</td>
<td><input id="txtres" /></td>
</tr>

</table>
</body>
<html>
于 2014-01-06T06:40:31.160 回答