我正在尝试获取一个值(一个字母)，然后将该值移动到文档中的另一个位置。因此，如果在文本框中输入“t”，我想将输入的值移动到 <p> 中。标签就在上面？我不确定如何更具描述性，因此我在下面包含了我的 html 和 javascript 代码。
仅供引用，我在一个编程训练营中，我们使用纯 Javascript 来完成这项作业，而不是 JQuery，而且我对此也完全陌生，所以如果这是一个愚蠢的问题，请原谅我。这是我到目前为止所拥有的
`
<!DOCTYPE html>
<html>
<body>
<h1>The Psychic Game</h1>
<h2>Guess what letter I'm thinking of.</h2>
<h3 id="wins">Wins:</h3>
<h3 id="losses">Losses:</h3>
<h3 id="guess">Guess Left:</h3>
<h3 id="guess_num">Your Guesses so Far: <p id="guess_val"> </p></h3>
<form>
<input type="text" name="guess_letter" value="">
</form>
</body>
</html>`
`var guessLetter = document.getElementById("guess_letter");
function letterPick(guessLetter){
}
`
最佳答案
我在这里所做的是将我们将使用的两个元素保存到变量中。然后我将 keyup 事件监听器添加到输入字段。每次按下键时，我们都希望更改 p 标签的 innerHTML 。
<!DOCTYPE html>
<html>
<body>
<h1>The Psychic Game</h1>
<h2>Guess what letter I'm thinking of.</h2>
<h3 id="wins">Wins:</h3>
<h3 id="losses">Losses:</h3>
<h3 id="guess">Guess Left:</h3>
<h3 id="guess_num">Your Guesses so Far: <p id="guess_val"> </p></h3>
<form>
<input type="text" name="guess_letter" value="">
</form>
<script>
var input = document.querySelector('[name="guess_letter"]');
var p = document.getElementById('guess_val');
input.addEventListener('keyup', (e) => {
p.innerHTML = e.currentTarget.value;
});
</script>
</body>
</html>
var input = document.querySelector('[name="guess_letter"]');
var p = document.getElementById('guess_val');
input.addEventListener('keyup', (e) => {
p.innerHTML = e.currentTarget.value;
});<!DOCTYPE html>
<html>
<body>
<h1>The Psychic Game</h1>
<h2>Guess what letter I'm thinking of.</h2>
<h3 id="wins">Wins:</h3>
<h3 id="losses">Losses:</h3>
<h3 id="guess">Guess Left:</h3>
<h3 id="guess_num">Your Guesses so Far: <p id="guess_val"> </p></h3>
<form>
<input type="text" name="guess_letter" value="">
</form>
</body>
</html>关于Javascript 将输入文本移动到另一个标签中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37331697/