如何使用Javascript来填充输入文本框中的输入div？

我正试图在填充div的输入文本框上运行脚本。该片段是像这样：如何使用Javascript来填充输入文本框中的输入div？

<input type="text" id="control" value="" /> 
<div id="displaydiv"></div> 
<script> 
document.getElementById("control").onkeydown = function() { 
document.getElementById("displaydiv").innerHTML = this.value; 
} 
</script>

的问题在这里是有一个字符，即滞后，如果我输入“A”，什么也不显示。当我输入'b'时，先前的'a'显示出来等等。我尝试用onkeyup替换onkeydown，并且还有一点滞后。如何让div实时匹配输入文本框，而无需刷新页面和/或在输入框上丢失焦点？

感谢您的期待。

来源

2012-06-06 Freakishly

“我试着用onkeyup替换onkeydown，而且还有一点滞后” - 欢迎使用web编程。 onKeyDown的速度与您将要获得的一样快......没有“beforeTheUserPressesAKey”事件。 – machineghost

这是因为onkeydown在密钥将其值添加到输入之前触发。改为使用onkeyup。它会以你以后的方式工作。

编辑：不知道如果我错过了速度的事情，如果你编辑你的问题，但你看到的滞后是不可避免的。它与您即将获得的“实时”非常接近。这真的甚至没有那么糟糕，不到半秒钟当我检查它在a fiddle

EDIT2：只是为了满足我的好奇心，我核对KnockoutJS的数据绑定的性能，与一个输入更新通过敲除一个div文本，另一个div通过你的脚本。性能是相同的。我其实有点惊讶淘汰赛没有引入任何明显的开销。这里是the fiddle

来源

2012-06-06 00:12:22 Tyrsius

如何使用Javascript来填充输入文本框中的输入div？

回答

相关问题