代码之家 › 专栏 › 技术社区 › whoislouis

JavaScript在键控时将输入值复制到innerHTML(addEventListener)

keyup addeventlistener javascript

-1

whoislouis · 技术社区 · 5 年前

<input type="text" id="test" value="">

<p id="box"></p>


<script type="text/javascript">

document.getElementById('test').addEventListener('keyup', function () {

document.getElementById('box').innerhtml = document.getElementById('test').value;

});

</script>

2 回复 | 直到 5 年前

BenoitVasseur 5 年前

正如Geuis所说(发表评论),您的错误是innerHTML(而不是innerHTML),请参见: https://codesandbox.io/s/724r405wo1

我鼓励您将代码更改为:

var box = document.getElementById('box')

document.getElementById('test').addEventListener('keyup', function (event) {
    box.innerHTML = event.target.value
});

Minan 5 年前

您必须使用输入值来获取即时输入。比如:

document.getElementById('input').addEventListener('input', (e) => {
    document.getElementById('box').innerHTML = e.target.value
})

推荐文章

aliezaheer · AddEventListener不适用于一个元素[重复]

2 年前

makerbaker · 取消选中框Javascript后重置输入值?

2 年前

Cain Nuke · 如何使事件侦听器在元素添加到DOM(纯js)后继续工作

2 年前

Bumboobee · 错误Uncaught TypeError:无法读取分离文件中null的属性(读取'addEventListener')

2 年前

aguywithquestions · 微调器加载动画页面加载后不会消失

2 年前

Abrar · Javascript颜色对比度查找器

2 年前

YannB · 如何为嵌套元素添加一个事件侦听器

6 年前

S16 · 使用普通JavaScript屏蔽名字和姓氏

6 年前

aman · 为什么要在脚本末尾执行Sourceopen事件侦听器?

6 年前

blake mcgarry · 如何使两个事件侦听器都工作

6 年前