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

[GPT] 监测输入框被 js 设置了值 ?input 输入框被设置了 value 值,但是没有触发 change 事件?的更多相关文章

  1. 不通过getElementByName实现获取表单数据 (document.form表单的name值.input输入框的name值)

    function update() { //document.form表单的name值.input输入框的name值 var username = document.form1.username; v ...

  2. js 触发 change 事件

    首先,请各位包涵,我本人对 JS 不是很熟,不知道"触发change事件"和"触发onchange事件"哪个更加合适.有园友知道的麻烦指出,先行谢过. 起因是这 ...

  3. file类型input框设置上传相同文件,并都可以触发change事件。

    在使用file类型input框是,删除了第一次上传到文件,再次上传相同文件,无法触发change事件,所以在删除的js上添加如下js代码: document.getElementById('fileU ...

  4. js与jquery获取input输入框中的值

    如何用javascript获取input输入框中的值,js/jq通过name.id.class获取input输入框中的value 先准备一段 HTML 一.jquery获取input文本框中的值 通过 ...

  5. 实时监听 JavaScript改变 input 值 input输入框内容 value 变化实时监听

    思路:通过setInterval()方法去定时对比新旧值 当时候JavaScript的onchange 和onpropertychange(注意ie版本) 监听输入框input时间,人为改变值是可以触 ...

  6. 改变input的值不会触发change事件的解决思路

    通常来说,如果我们自己通过 value 改变了 input 元素的值,我们肯定是知道的,但是在某些场景下,页面上有别的逻辑在改变 input 的 value 值,我们可能希望能在这个值发生变化的时候收 ...

  7. iframe页面改动parent页面的隐藏input部件value值,不能触发change事件。

    实现一个依据iframe页面返回充值卡类型不同,安排不同的input部件. 点击选择弹出一个iframe.点击充值卡数据行.返回1.充值卡类型.2.充值卡id(用的UUID).3.充值卡号(字符串). ...

  8. JS通过正则限制 input 输入框只能输入整数、小数(金额或者现金)

    第一: 限制只能是整数 <input type = "text" name= "number" id = 'number' onkeyup= " ...

  9. JS改变input的value值不触发onchange事件解决方案 (转)

    方法(一)(转载的网络资料) 需要了解的知识     首先,我们需要了解onchange和onpropertychange的不同: IE下,当一个HTML元素的属性改变的时候,都能通过 onprope ...

  10. 使用js实现input输入框的增加

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. drf(路由)

    一 自动生成路由 基本使用 # 视图类,继承了ViewSetMixein,路由 # path('books/', views.BookViewSet.as_view(actions={'get': ' ...

  2. Android实际开发bug大总结

    目录介绍 1.1 java.lang.UnsatisfiedLinkError找不到so库异常 1.2 java.lang.IllegalStateException非法状态异常 1.3 androi ...

  3. 基础教材系列:编译原理——B站笔记

    一.编译器是什么 源程序→预处理器→经过预处理的源程序→编译器→汇编语言程序→汇编器→可重定位的机器代码→链接器/加载器→目标机器代码. 编译器的结构: 与源语言相关:字符流→词法分析器→词法单元流→ ...

  4. vue,vuex,element实现无限tab页效果

    直接撸代码 ?满足你 码云地址 效果图 tab页由来 甲方爸爸的更改需求,无力反抗 分析代码 懒的写,直接撸就行 参考文章 点我

  5. KingbaseES数据库改写SQL Server数据库CROSS APPLY和OUTER APPLY

    一.功能介绍: CROSS APPLY和OUTER APPLY是SQL Server中的一种连接操作,类似于JOIN语句可以将一张表与一个表函数或一个子查询进行关联.表函数是一种返回一个表类型的数据的 ...

  6. 探秘Kubernetes:在本地环境中玩转容器技术

    在云计算时代,Kubernetes 已成为云原生技术的真正基石.它是应用程序容器的编排动力源,可跨多个集群自动部署.扩展和运行容器.Kubernetes 不仅仅是一个流行词,它还是一种模式转变,是现代 ...

  7. #对顶堆#nssl 1477 赛

    分析 首先按小到大排序,考虑枚举两个都喜欢的个数\(i\) 那么只喜欢一个的个数各需要\(k-i\),剩下要补充到\(m-k*2+i\)个, 考虑用对顶堆维护大根堆大小仅有\(m-k*2+i\)即可 ...

  8. C 语言文件读取全指南:打开、读取、逐行输出

    C 语言中的文件读取 要从文件读取,可以使用 r 模式: FILE *fptr; // 以读取模式打开文件 fptr = fopen("filename.txt", "r ...

  9. Qt实现多图片合成PDF文件

    需求:纯Qt,把多张图片合成到一个PDF文件中 // 合成PDF // include <QPdfWriter> QString pdfFileName = "D:\\a.pdf ...

  10. MogDB/openGauss 开机自启动

    MogDB/openGauss 开机自启动 在 centos7.6 操作系统上设置 MogDB/openGauss 开机自启动,我们先来了解一下自定义服务的配置文件组成部分,共分为[Unit].[Se ...