Question

我目前正在努力解决这个问题。情况如下。我在页面上有多个输入字段

Input1和Input2影响Input3的内容。

现在，如果Input3的内容发生变化，我就不会触发事件处理程序。我试过了

$('#div-xy').on('change', 'input', function(){console.log('input changed')});

但是，如果焦点也在Input3上，那似乎只能起作用，而不是因为我输入的是input2或input3。我也试过

$('#div-xy').bind('DOMSubtreeModified', function(){console.log('CHANGE2')});

悲伤地产生同样的效果。您是否知道如何检查Input3中的更改？非常感谢帮助。

Answer 1

试试这样：

如果您有许多这些字段，而不是将处理程序绑定到每个字段，那么使用委托事件处理程序可以获得更好的性能：

<强> HTML：

<div id='parent'>
    <input type="text" class="search-field" />
    <input type="text" class="search-field" />
    <select class="search-field" ><option>1</option><option>2</option></select>
    <input type="radio" class="search-field" />
</div>

<强> JS：

$('#parent').on('change', '.search-field', function() {
    // validate all search field values
    // display search results based on values
    // if search results already shown, filter based on $(this).val()
    console.log($(this).val());
});

Answer 2

更改事件仅在用户输入时触发，但可以显式触发。

因为你正在使用jQuery：

$('#input2').change(()=>{
    console.log('input 2 is changed');

    $('#input3').val('some val');
    $('#input3').change()
})

$('#input3').change(()=>{
    console.log('input 3 is changed');
})

Answer 3

从技术上讲，更改事件发生在用户更改了元素的值时。如果通过jquery或其他代码更改input3的值，它将不会自行发生。但是你可以在任何其他jquery函数中手动触发它，如果有input.change（）的定义，那么它将被执行。

jQuery - 事件监听器“更改”仅在焦点位于对象上时才有效

3 个答案: