Question

正如标题所述：我想将输入值实时复制到html元素中。我已经尝试过类似的方法，但是它无法正常工作……提前THX！

<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>

Answer 1

必须使用输入值来获取即时输入。喜欢：

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

Answer 2

就像格伊斯所说（发表评论），您的错误是innerHTML（而不是innerhtml），请参见：https://codesandbox.io/s/724r405wo1

我鼓励您将代码更改为：

var box = document.getElementById('box')

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

因此，您不必每次都查询dom。

JavaScript在keyup（addEventListener）上将输入值复制到innerHTML

2 个答案: