JQuery 检测由 JS 进行更改的更改输入

Question

我想检测由 JS 进行更改的输入值的更改。

HTML:

<input type="text" name="test_input"><br><br>
<button name="change_input">Change usign JS </button>

JS:

$(function() {
    $('body').on('change','input[name="test_input"]',function() {
        alert('Changed');
    });
    $('button[name="change_input"]').on('click',function() {
        $('input[name="test_input"]').val('New value');
    });
})

https://jsfiddle.net/7c54r7x9/

谢谢

Answer 1

更改事件仅在用户输入进行修改时引发。当它以编程方式设置时，您需要自己引发事件。在 jQuery 中，您可以使用 trigger() 来做到这一点，如下所示：

$(function() {
  $('body').on('change', 'input[name="test_input"]', function() {
    console.log('Changed');
  });

  $('button[name="change_input"]').on('click', function() {
    $('input[name="test_input"]').val('New value').trigger('change');
  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="test_input"><br><br>
<button name="change_input">Change usign JS </button>

Answer 2

如下更改您的代码。希望对您有所帮助

$(function() {
    $('input[name="test_input"]').change(function() {
        alert('Changed');
    });
    $('button[name="change_input"]').on('click',function() {
        $('input[name="test_input"]').val('New value');
    $('input[name="test_input"]').trigger("change");
    });
})

JQuery 检测由 JS 进行更改的更改输入

JQuery Detect change input where the change was made by JS

html

jquery

detect