JavaScript / jQuery-更改時第一次輸入原始值，第二次輸入先前值

Question

我想使該值動畫化，但是使用我使用的功能，過去的值需要存儲在某個地方（不確定該在哪里）

的HTML

<input type="text" id="text" value="100">
<h1>My value: <span id="text-output">100</span>

JS

$input = $('#text');
    $input.on('change', function(){
        var val = $(this).val();
        var memoryValue = 1; //I need this to be original value first time and previous value second times

        animateNumber($('#text-output'), memoryValue, val, 300);

    })

小提琴： http : //jsfiddle.net/v5Sa7/

我創建了一個具有類的dom元素，並且每次更改值時都會增加類名，但是如果多次更改該值將變得很丑陋。

有任何想法嗎？

Answer 1

您可以在元素上分配一個數據屬性。 jQuery.data（）

$input = $('#text');
$this.data("previousVal", 100); //Initialize the data attribute to 100
$input.on('change', function(){
    var $this = $(this);
    var val = $this.val();
    var memoryValue = $this.data("previousVal");
    $this.data("previousVal", val);
    animateNumber($('#text-output'), memoryValue, val, 300);
})