js table动态添加input onchange事件失效问题

2018-05-29 03:58:29 1.9k 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

泛微E9表单开发：详解明细字段属性联动JS实现与实战在Web前端开发与低代码平台实践中，表单联动是提升用户体验和保证数据有效性的关键技术。其核心原理是通过JavaScript监听表单字段值的变化，并动态操作DOM元素属性，从而控制其他相关字段的显示、编辑、必填等状态。这项技术对于构建复杂业务表单、实现动态校验和流程自动化具有重要价值，广泛应用于ERP、OA、CRM等企业级系统的二次开发场景。本文将聚焦于泛微E9平台这一具体技术栈，深入剖析其明细表（Detail Table）这一复杂数据结构下的属性联动实现。针对开发中的常见痛点，如动态新增行导致的事件绑定失效阅读详情

let table = document.getElementById("table");
let oneRow = table.insertRow();
let cell= oneRow.insertCell();
cell.innerHTML = "<input onchange='this.onInputChange'/>";

...全文

Chakra UI核心原理：原子化设计系统与可编程主题实战 Chakra UI并非普通React UI库，而是将设计系统规则编译为运行时可组合属性的前端架构方案。其本质是CSS-in-JS之上的设计系统编译器，通过Token映射层（CSS Custom Properties）、响应式编译层（构建时生成媒体查询）和语义化约束层（colorScheme自动触发完整色阶）实现样式即配置。技术价值在于消除重复样式逻辑、保障无障碍合规、提升主题可维护性，并天然适配React 18并发渲染与微前端场景。典型应用场景包括中后台系统快速搭建、多端一致的主题管理、以及高性能表格与表单阅读详情

天黑了天亮了

JavaScript 87,984 成员 224,681 内容

+ 关注 + 加入社区

切换为时间正序

天黑了天亮了 2018-05-30

打赏
举报

天黑了天亮了 2018-05-30

打赏
举报

我之前就试过了，用html5写一个确实没问题，但是在js文件里面写就有问题，好像是innerhtml导致onchange失效，各位有没有办法解决一下

Logerlink 2018-05-30

打赏
举报

你应该是用对象写法吧试试换成这样的用对象指向方法名,而不是用this

文盲老顾 2018-05-30

打赏
举报

onchange事件触发时，this指向的是控件本身，如果你要引用类中定义的方法，不要加上完整的类路径，或者

let table = document.getElementById("table");
    let oneRow = table.insertRow();
    let cell= oneRow.insertCell();
    var input = document.createElement('input');
    cell.appendChild(input);
    input.onchange = this.onInputChange;  // 这个时候的this是在做的js片段对应的this