首先让我说我是 javascript 的新手。
我正在尝试将 div 的内容更改为我输入的任何字母。因此，如果我在页面的任意位置按“p”，div 文本将添加该字母。
例如:
<html>
<head>
<script>
document.getElementById("change").onkeyup = function() {myFunction()};
function myfunction(){
}
</script>
</head>
<body>
<div id=change>p</div>
</body>
</html>
函数是我卡住的地方。
我见过很多涉及在文本框中键入内容的示例，但没有一个是没有的。如果有人能指导我正确的方向，我将不胜感激。
最佳答案
为什么您的代码不起作用？
您不能使用 keyup <div> 上的事件元素，因为 JavaScript 永远不会触发它，因为 div 永远不会聚焦。元素必须聚焦以接收按键事件，否则用户如何知道他们的键盘将输入到哪里。
我们能做些什么？
始终“具有焦点”的一个元素是 <body>网页(当然，除非您使用网络浏览器的不同区域，例如为站点添加书签、使用 URL 栏导航等)。
所以，我们可以检测页面body上的事件，然后相应地改变div的内容。我们可以使用 document.body.onkeyup = function(event) 检测事件, 然后使用 document.getElementById("change").innerHTML 更改 div 内容，它通过它的 ID 定位该 div，然后将它的 HTML 值设置为新的值。
但是，JavaScript 只会发回被按下的键的代码(它是键的内部表示)，而不是键所代表的字符 - (如果您试图检测一个键是否像backspace 或 ctrl 已被按下)。我们可以使用 event.keyCode 从事件中获取此值.
因此，我们必须将其转换为字符串，这是我们代码的最后一段:String.fromCharCode(event.keyCode) .这会将字符代码转换为字符串。
总而言之，我们可以更新 div 的值以响应按键。
工作示例
document.body.onkeyup = function(event) {
document.getElementById("change").innerHTML = String.fromCharCode(event.keyCode);
}<div id="change">p</div>注意事项
- 您可以使用
onkeypress而不是onkeyup如果你想检测字母的大小写； - 您可以使用
+=而不是=如果您想将现在输入的内容附加到 div 中已有的内容； - 如果您只想将 div 用作可以键入的地方，请查看 contenteditable ;
- 如果您想要一个不映射到字符串值的键码列表，请查看this list .
关于javascript - 如何在 javascript 中使用 onkeyup 将文本添加到不是文本框的 div？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45451692/