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

Question

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

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>

或者这里是demo

但它不起作用。我希望我们在该 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>