0

我想问一下我们应该如何用 HTML 编写来自动显示 Web 用户在同一页面上给出的输入,而无需按钮或单击。

这是我从其他地方复制的示例:

<!DOCTYPE HTML>
<HTML>
<head>
</head> 
<body>
<script type="text/javascript">

function changeThis(){      
   var formInput = document.getElementById('theInput').value;   
   document.getElementById('newText').innerHTML = formInput;   }  
</script>

<p>You wrote: <span id='newText'></span> </p> 
<input type='text' id='theInput'>   
<input type='button' onclick='changeThis()' value='See what you wrote'/>   
</body>  
</html> 

我想在不使用任何按钮、单击或 Enter 选项卡的情况下获得相同的效果。

换句话说,给出的输入显示在用户在行框上放东西之后的“你写的”旁边。

4

2 回答 2

0

请看下面的代码。只要您在输入框中输入,它就会写入文本:

<!DOCTYPE html>
<html>
<body>


Enter your name: <input type="text" id="fname" onkeyup="myFunction()">
<p id="rewrite"></p>

<script>
function myFunction() {
  var x = document.getElementById("fname");
  document.getElementById("rewrite").innerHTML=x.value;
}
</script>

</body>
</html>
于 2020-05-31T18:24:36.770 回答
0

请参阅下面的代码片段以获取解决方案:

let input = document.querySelector('#theInput');
input.addEventListener('input', () => {
document.querySelector('#newText').innerHTML = input.value;
})
 <p>You wrote: <span id='newText'></span> </p> 
 <input type='text' id='theInput'>   
 <input type='button' value='See what you wrote'/>  
 

于 2020-05-31T18:25:26.267 回答