閱讀文本框輸入並放入兩個框之一javascript

Question

我想讓用戶在文本框中輸入1個字母，然後將這些字母放入2個框中的1個。這是一個hang子手遊戲，所以它會根據它是否在單詞中來劃分字母。這是我的代碼。希望有人能幫助我。我是新來的JavaScript！我做了大量的谷歌搜索，但無濟於事。

var words = ['dog', 'computer', 'cat', 'monkey', 'human']; 

var wordForGuess = chooseWord(); 

var wordLength = wordForGuess.length; 

function chooseWord() { 
    return words[Math.floor(Math.random() * words.length)]; 
} 

function writeWord() 
{ 
    var textarea = document.getElementById('textBox').value; 

    for (var x = 0; x<wordLength; x++) 
    { 
    if (textarea === wordForGuess.indexOf(x)) 
    { 
     document.getElementById('correctLetters').value = textarea; 
    } 
    else 
    { 
     document.getElementById('incorrectLetters').value = textarea; 
    } 
    } 
} 

還有HTML我的文本框

<div id = 'letterInput'> 
</div> 

<input type = 'text' id = 'textBox' onkeyUp="writeWord()"/> 

<div id = 'correctLetters'> 
</div> 

<div id = 'incorrectLetters'> 
</div> 

Answer 1

我想你已經犯了一些錯誤，包括對你的角色迭代在你選擇的字和使用，而不是隻檢查該迭代的指數來自輸入框的值。我也認爲你應該重置每個鍵盤上的值。我也將你的onkeyup事件從HTML移到了JavaScript中，我想也許在你的情況下，JavaScript尚未加載，但很難從你的例子中知道。

<div id = 'letterInput'> 
    </div> 
    <input type = 'text' id = 'textBox' /> 
<br/> 
Correct: 
<div id = 'correctLetters'> 

    </div> 
<br/> 
Incorrect 
    <div id = 'incorrectLetters'> 

    </div> 

這裏是JavaScript的一些修正：

var words = ['dog', 'computer', 'cat', 'monkey', 'human']; 

var wordForGuess = chooseWord(); 

var wordLength = wordForGuess.length; 

function chooseWord() { 
    return words[Math.floor(Math.random() * words.length)]; 
} 

function writeWord() { 
    var input, textarea; 

    input = document.getElementById('textBox') 
    textarea = input.value; 
    input.value = ""; 
    console.log("writing word", textarea); 

    if (wordForGuess.indexOf(textarea) !== -1) { 
     document.getElementById('correctLetters').innerText += textarea; 
    } else { 
     document.getElementById('incorrectLetters').innerText += textarea; 
    } 
} 

document.getElementById("textBox").onkeyup = writeWord; 

這裏有一個jsfiddle與此代碼。