[GPT] 监测输入框被 js 设置了值 ？input 输入框被设置了 value 值，但是没有触发 change 事件？

1. input 输入框被设置了 value 值，但是没有触发 change 事件 ？

如果输入框的 value 值是通过 JavaScript 代码直接设置的，那么不会触发 change 事件，这是正常的行为。

change 事件只会在用户手动更改输入框的值并使其失去焦点时触发。

如果输入框的 value 值是通过用户交互（如键盘输入、复制粘贴等）或者浏览器自动填充（如记住密码功能）的方式设置的，那么应该会触发 change 事件。

如果没有触发 change 事件，可能是因为代码中存在 bug 或者事件绑定有问题。

 

2. 如何监测输入框被 js 设置了值 ？

可以使用 MutationObserver 或者自定义事件来监听输入框的值是否被改动。

以下是使用 MutationObserver 的示例代码：

// 获取输入框元素
var input = document.querySelector('#my-input');

// 创建一个 MutationObserver 实例
var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    if (mutation.type === 'attributes' && mutation.attributeName === 'value') {
      console.log('输入框的值被修改了');
    }
  });
});

// 监听输入框属性变化
observer.observe(input, { attributes: true });

// 在其他 JS 代码中修改输入框的值
$('#my-input').val('新的值');

以上代码中，我们在其他 JS 代码中使用 jQuery 修改了输入框的值，然后通过 MutationObserver 监听到了输入框的值被修改的事件，并输出了相应的信息。

以下是使用自定义事件的示例代码：

// 获取输入框元素
var input = $('#my-input');

// 绑定自定义事件
input.on('value-set', function() {
  console.log('输入框的值被设置了');
});

// 在其他 JS 代码中修改输入框的值并触发自定义事件
$('#my-input').val('新的值').trigger('value-set');

以上代码中，我们在其他 JS 代码中使用 jQuery 修改了输入框的值，并手动触发了自定义事件。在自定义事件的回调函数中，我们可以处理输入框的值被修改的事件。

 

Cool：ChatAI

Link：https://www.cnblogs.com/farwish/p/17473538.html