javascript - 获取输入事件的先前值

Question

我有一个必须动态更改的值:原始值为 6，我可以自定义它。如果我把 7 放在输入框上，我现在有 13。当我添加另一个数字时，例如 71，我的值改变 13 + 71。我想用前一个值 (7) 减去 13 得到我原来的值6.

这是我的片段:

$('.test :input').on('input', function(){

var ok = $('.ok');
ok.text(parseFloat(ok.text()) + parseFloat($(this).val()))
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="ok" style="background-color: white">
6
</div>
<div class="test">
<input type="text"/>
</div>

如果您尝试输入 45，您应该输入 51，而您输入的是 55。

我已经尝试过在某些线程上显示的“聚焦”，但我没有离开输入，所以它不起作用。我不知道如何获得我以前的值(value)。

Answer 1

您的要求并不完全清楚。但我可以看到你的选择器是错误的。您还需要确保在查询其中的元素之前已加载文档。

我将事件监听器更改为 onChange，这样就不会在每次按键时都发生添加。

$(document).ready(function() {
  $('.test input').on('change', function() {
    var ok = $('.ok');
    ok.text(parseFloat(ok.text()) + parseFloat($(this).val()))
  })
});

这是一个 plunker它正在运行。
这是对您所问内容的另一种猜测，plunker .它将初始值存储为一个属性。

$(document).ready(function() {
  var ok = $('.ok');

  $('.ok').text(ok.attr('data-initial-value'));
  $('.test input').on('change', function() {
    ok.text(parseFloat(ok.attr('data-initial-value')) + parseFloat($(this).val()))
  })
});

<div class="ok" data-initial-value="6" style="background-color: white">
  </div>