在更改之前获取输入的旧值并将总值更改为 + 或 -

Question

我想制作积分分配表格。 我有 4 个输入类型数值 0-100，总分 = 100 分。所以我们可以在每个输入中放置 25 个点。我已经可以验证输入数字 min 0 max 100 并从总更改的输入值中减去。 我在添加到 Total 时遇到问题。如果用户更改已经更改的值，我需要制作 Total + value（更改前）然后 Total - value（更改后）。 我不知道如何在改变之前获得价值。

我的html

<input type="number" min="0" max="100" name="1" />
<input type="number" min="0" max="100" name="2" />
<input type="number" min="0" max="100" name="3" />
<input type="number" min="0" max="100" name="4" />
<input type="text" id="Total" name="Total" value="100"/>

我的脚本

$("input[type=number]").keyup(function(event) {
    max=100;
  min=0;
    value=( parseInt($(this).val()));
    if(value < min || isNaN(parseInt(value))) 
        $(this).val(0)
    else if(value > max) 
        $(this).val(100);
    else return value;
});

var total, myVal;
$("input[type=number]").change(function(event) {
    maxPoints = parseInt($('#Total').val());
    myVal = ( parseInt($(this).val()) || 0);
    total = maxPoints - myVal;
    $('#Total').val(total);
});

如果我能够将旧值保存到某个 var，我会将 .onchange 脚本更改为类似的内容，我认为它应该可以工作。但是我如何才能获得旧值？

$("input[type=number]").change(function(event) {    
    oldValue = ???? - how to get this ? :P
    if(oldValue>0){
        maxPoints = parseInt($('#Total').val()) + oldValue;
    }else{
        maxPoints = parseInt($('#Total').val());
    }    
    myVal = ( parseInt($(this).val()) || 0);
    total = maxPoints - myVal;
    $('#Total').val(total);
});

有 js fiddle 它现在是如何工作的。 Fiddle here

Answer 1

嗨，像这样保存旧值

$("input[type=number]").change(function(event) {    
    oldValue = $(this).data('oldvalue');
    if(oldValue>0){
        maxPoints = parseInt($('#Total').val()) + oldValue;
    }else{
        maxPoints = parseInt($('#Total').val());
    }    
    myVal = ( parseInt($(this).val()) || 0);
    total = maxPoints - myVal;
    $(this).data('oldvalue',$(this).val()) // update old value to new value
    $('#Total').val(total);
});

<input type="number" min="0" data-oldvalue='0' max="100" name="1" />
<input type="number" min="0" data-oldvalue='0' max="100" name="2" />
<input type="number" min="0" data-oldvalue='0' max="100" name="3" />
<input type="number" min="0" data-oldvalue='0' max="100" name="4" />
<input type="text" id="Total" name="Total" value="100"/>