HTML contenteditable 元素上的 onkeyup 事件返回未定义

Question

我正在尝试使用 onkeyup 事件基于 div contenteditable 元素的另一个文本来绑定 div 元素文本值，如下所示：

var input = document.getElementById('editor');

    input.onkeyup = function() {
  document.getElementById('console').innerHTML = input.text;
  }

这是我的标记：

<div id="editor" contenteditable>text here</div>

<div id="console"></div>

或者这是演示

但这不起作用。我希望我们在 contenteditable div 元素上键入的任何文本也可以直接更改<div id="console"></div>

很抱歉给您带来令人困惑的解释，希望你们理解我的问题，我的问题是我该如何解决这个问题？或者有什么想法吗？

Answer 1

问题是input.text。HTML 元素没有名为 的属性text，因此当您获取值时，它是undefined。也许你想要innerText？

var input = document.getElementById('editor');

input.onkeyup = function() {
  console.log(input.innerText)
  document.getElementById('console').innerHTML = input.innerText;
}

<div id="editor" contenteditable>Type here</div>

<div id="console"></div>