2014-10-07 140 views
0

我想让用户在文本框中输入1个字母,然后将这些字母放入2个框中的1个。这是一个hang子手游戏,所以它会根据它是否在单词中来划分字母。这是我的代码。希望有人能帮助我。我是新来的JavaScript!我做了大量的谷歌搜索,但无济于事。阅读文本框输入并放入两个框之一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> 

回答

0

我想你已经犯了一些错误,包括对你的角色迭代在你选择的字和使用,而不是只检查该迭代的指数来自输入框的值。我也认为你应该重置每个键盘上的值。我也将你的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与此代码。

相关问题