带有 div 的 Javascript/HTML Oninput

Question

我已经为 div 制作了 oninput 类。我无法将 ID 添加到 div。所以这是我的脚本:

var objecto = document.getElementsByClassName(" nicEdit-main ")[0];
objecto.oninput = function() {
    alert("Ok!");
}  

这是我的 HTML:

<div class=" nicEdit-main   " style="width: 499px; margin: 4px; min-height: 149px; overflow: hidden;" contenteditable="true">1123215545<br></div>

为什么 oninput 对这个 div 不起作用？

Answer 1

它应该工作正常，确保你的脚本在目标元素加载到 dom 后执行。

一种方法是使用 dom 就绪/窗口加载事件处理程序

window.addEventListener('load', function() {
  var objecto = document.getElementsByClassName(" nicEdit-main ")[0];
  objecto.oninput = function() {
    alert("Ok!");
  }
})

<div class=" nicEdit-main   " style="width: 499px; margin: 4px; min-height: 149px; overflow: hidden;" contenteditable="true">1123215545
  <br>
</div>

---

另一种是将脚本放在元素之后，如

<div class=" nicEdit-main   " style="width: 499px; margin: 4px; min-height: 149px; overflow: hidden;" contenteditable="true">1123215545
  <br>
</div>
<script>
  var objecto = document.getElementsByClassName(" nicEdit-main ")[0];
  objecto.oninput = function() {
    alert("Ok!");
  }
</script>