Addition and subtraction multiple text fields

Question 1

Change:

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

to:

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

In the .sub handler, sum is negative, so you need to add it to val in order to subtract.

FIDDLE

Question 2

I would suggest the next solution:

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));
});

Try it

Question 3

How's this:

http://jsfiddle.net/fYSgn/

I've combined the the two blur functions

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);
});

Question 4

Based on your fiddle you could simply do the following:

$(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));
    })
})

EXAMPLE

FuN vERsiON!¡!

Question 5

shortest version of jquery to do what you want...inspiring really.

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);});

and yes this is all code...

Question 6

<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>