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

Question

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

Answer 1

cell.innerHTML = "<input onchange='this.onInputChange'/>";
 换成
cell.innerHTML = "<input onchange='onInputChange()'/>";
而且 onchange需要input 失去焦点才会触发

Answer 2

这样的话onInputChange这个方法会undefined

Answer 3

onInputChange是什么？

Answer 4

是不是因为你的onInputChange方法定义在动态生成input之后？

Answer 5

this.onInputChange，这里this是window，有没有定义onInputChange这个function?

Answer 6

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

Answer 7

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

Answer 8

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

Answer 9

在html标签中设置的事件，事件代码中的this表示当前触发事件的DOM元素，不是你的那个对象