为什么此代码适用于输入文本框但不适用于可信任的div?

时间:2012-03-07 19:45:51

标签: javascript innerhtml contenteditable onkeyup

我有一段Javascript代码如下:

<div id="TestControl" contentEditable="true" style="width:200px; position:absolute; left:100; top:100; border: 1px solid #000;"></div>
<div style="position:absolute; left:100; top:200; width:200px; border:1px solid #000; padding: 5px 5px 5px 5px;" id="displaydiv" ></div>
<script>
document.getElementById("TestControl").onkeyup = function() {
document.getElementById("displaydiv").innerHTML = this.value;   
}
</script>

如果我用输入文本框替换contenteditable div,此代码可以正常工作。为什么会出现差异?

感谢您寻找:)

1 个答案:

答案 0 :(得分:2)

内容div没有名为value的属性

<div id="TestControl" contentEditable="true" style="width:200px; position:absolute; left:100; top:100; border: 1px solid #000;"></div>
<div style="position:absolute; left:100; top:200; width:200px; border:1px solid #000; padding: 5px 5px 5px 5px;" id="displaydiv" ></div>
<script>
document.getElementById("TestControl").onkeyup = function() {
document.getElementById("displaydiv").innerHTML = this.value || this.textContent || this.innerText || this.innerHTML;   
}
</script>