如何获取更改的输入框值？

Question

我有如下jquery，

$(document).on('click', '.save_button', function (e) { 
    var amount = $('.actual_pay').val();
});

这意味着当用户单击类save_button的按钮时，脚本会执行并将var amount的值设置为类actual_pay的字段值。

这没有问题，它工作正常，但类名称actual_pay的输入框是可编辑的，任何时候值可以更改，我必须检测输入框的更改值，我试过

var amount = $('.actual_pay').val().change(); 

但它显示错误：

.change不是一个功能。

如何检测类actual_pay发生的变化并将更改后的值存储到金额变量？

Answer 1

您可以附加input事件监听器。

var amount;
$('.actual_pay').on("input", function(){
  console.log("Something is changed in actual_pay");
  amount = $(this).val(); // save val
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="actual_pay">

调用输入事件的动作是

• 在元素中输入一些文本。
• 剪切，删除或粘贴某些内容。
• 将一些内容放入元素中。 （仅限Google Chrome和Safari）

Answer 2

$('.actual_pay').val().change();不会工作，因为这是错误的方法。您可以通过以下方法来完成

$('.actual_pay').on('input',function(){
 alert('Something Modified');
});

Answer 3

您可以使用此函数获取该输入框的值：

$( "input.actual_pay" ).keyup(function() {

        var amount = $(this).val();
    });

如果您手动更改该输入，则将使用“keyup”，否则您应该使用

$( "input.actual_pay" ).change(function() {

        var amount = $(this).val();
    });