javascript输入和检查数学功能

Question

<input name="searchTxt" type="text" maxlength="512" id="searchTxt" class="searchField"/>
<p id="text"></p>
<script>
var input = document.getElementById("searchTxt");
document.getElementById('text').innerHTML = input.value;</script>

我输入了输入内容，文本应该显示在下面，但是没有，我也不知道为什么，有人知道这可能是什么问题吗？

Answer 1

如果要在用户键入字段时运行脚本，则需要将其放入事件侦听器中。 首次加载页面时，您的代码仅运行一次。 由于尚未在文本字段中输入任何内容，因此不会将任何内容添加到innerHTML 。

 document.getElementById("searchTxt").addEventListener('keyup', function() { document.getElementById('text').innerHTML = this.value; }); 

 <input name="searchTxt" type="text" maxlength="512" id="searchTxt" class="searchField" /> <p id="text"></p> 

Answer 2

将oninput事件处理程序附加到input元素，如下所示：

var input = document.getElementById("searchTxt");

input.oninput = function() {
    document.getElementById('text').innerHTML = input.value;    
}

input.onpropertychange = input.oninput; // for IE8 and below

的jsfiddle