2017-06-05 114 views
0

這裏很新的Javascript,我想我有一個邏輯問題。所以基本上,我正在建造一個hang子手遊戲,而且我遇到了雙字母的問題。例如,如果這個詞是食物,當我輸入一個「O」時,它將通過for循環,首先擊中O,將它推到屏幕上,並在其軌道上停下來。我可以做任何我想要的第一個「O」,但第二個或任何其他重複的信件會被忽略。現在,我直接在for()循環的開始處編寫的警報將成功打印「O's」,並將其記錄到控制檯,甚至可以寫出document.write(splitWord [m]);JavaScript for循環不重複字符串

對我來說,我認爲它必須是我的if語句。我可能100%錯了,但我認爲if語句告訴它看到第一個「O」,做括號內的內容,然後繼續下一個字母,跳過任何雙打。如果我對此有所瞭解,繼續循環將會是更好的選擇,所以「O's」都會被填滿。如果我完全錯了,完成這項任務會是更好的行動。任何幫助將非常感激。

感謝

var remainingLetters = ["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"]; 
 

 

 
var removedLetters =[]; 
 
var wordList = ["django", "the#good#the#bad#and#the#ugly", "a#fistful#of#dollars","for#a#few#dollars#more","once#upon#a#time#in#the#west","the#wild#bunch","pale#rider"]; 
 
var titleList =["django", "The Good The Bad And The Ugly", "A Fistful of Dollars", "For a few Dollars More", "Once Upon a Time in the West", "The Wild Bunch", "Pale Rider"]; 
 
var songList =["Jango", "The Good The Bad And The Ugly", "Fistful of Dollars", "For a few Dollars More", "Once Upon a Time in the West", "The Wild Bunch", "Pale Rider"] 
 

 

 

 
var selectedWord; 
 
console.log(selectedWord); 
 

 
var livesRemaining = 12; 
 
var score = 0; 
 
var wordWorth = 0; 
 
var wins = 0; 
 
var losses = 0; 
 
var gameOn = false; 
 

 
function chooseAWord(){ 
 
\t selectedWord = wordList[Math.floor(Math.random() * wordList.length)]; 
 
\t console.log(selectedWord); 
 
} 
 

 
function printWord(){ 
 
\t document.getElementById("wordDisplayer").innerHTML = selectedWord; 
 
} 
 

 

 
function buildTiles(){ 
 
    // create a new div element 
 
    // and give it some content 
 
    var splitWord = selectedWord.split(""); 
 
    for(i = 0; i < splitWord.length; i++){ 
 
    \t if (splitWord[i] != '#'){ 
 
    \t \t // var newTile = document.createElement("div"); 
 
    \t \t //var newContent = document.createTextNode(""); 
 
    \t \t //newTile.appendChild(newContent); //add the text node to the newly created div. 
 

 
\t \t document.getElementById("wordTiles").innerHTML += '<div class="tileStyle" id="' + splitWord[i] + '"></div>'; 
 

 
\t \t \t wordWorth++; 
 
\t \t \t 
 

 

 
    \t \t // add the newly created element and its content into the DOM 
 
    \t \t //var currentDiv = document.getElementById("wordTiles"); 
 
    \t \t //currentDiv.appendChild(newTile, currentDiv); 
 
    
 
    \t \t // newTile.setAttribute("class", "tileStyle"); 
 
    \t \t \t }else if(splitWord[i] == '#'){ 
 
    \t \t \t \t var blankTile = document.createElement("div"); 
 
    \t \t \t \t var spaceContent = document.createTextNode(""); 
 
    \t \t \t \t blankTile.appendChild(spaceContent); 
 

 
    \t \t \t \t document.getElementById("wordTiles").innerHTML += '<div class="blankStyle" id="' + splitWord[i] + '"></div>'; 
 
    \t \t \t } 
 
    \t \t } 
 
} 
 

 

 
function clearTiles(){ 
 
\t var myNode = document.getElementById("wordTiles"); 
 
\t while (myNode.firstChild) { 
 
    \t myNode.removeChild(myNode.firstChild); 
 
\t } 
 

 
} 
 

 
function refreshAlphabet(){ 
 
\t remainingLetters = ["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"]; 
 
\t displayAvailableLetters(); 
 
} 
 

 

 
function keyPressed(){ 
 
\t checkPlayerChoiceNew(); 
 
} 
 

 
var playerGuess = document.onkeyup = function myKeyDown(event){ 
 
\t playerGuess = event.key; 
 
\t if(gameOn==true){ 
 
\t \t keyPressed(); 
 
\t }else{ 
 

 
\t } 
 
} 
 

 

 

 

 
function checkPlayerGuess(){ 
 
\t document.getElementById("isThisWorking").innerHTML = playerGuess; 
 

 
} 
 

 

 

 

 
// function myFunction() { 
 
// var str = "Tha bast things in lifa ara free"; 
 
// var patt = new RegExp(playerGuess); 
 
// var res = patt.test(selectedWord.toLowerCase()); 
 
// document.getElementById("demo").innerHTML = res; 
 
//} 
 

 

 
function displayAvailableLetters(){ 
 
\t document.getElementById("lettersStillAvailable").innerHTML = remainingLetters; 
 
\t console.log(remainingLetters); 
 
\t 
 
} 
 

 
function displayRemovedLetters(){ 
 
\t document.getElementById("lettersUsed").innerHTML = removedLetters; 
 
} 
 

 

 
function updateScore(){ 
 
\t document.getElementById("scoreTotal").innerHTML = score; 
 
} 
 

 
function updateWins(){ 
 
\t document.getElementById("winTotals").innerHTML = wins; 
 
} 
 
function updateLosses(){ 
 
\t document.getElementById("lossTotals").innerHTML = losses; 
 
} 
 

 
function checkScore(){ 
 
\t if(score == selectedWord.length && livesRemaining > 0){ 
 
\t \t document.getElementById("gameOver").innerHTML = "WINNER! Congratulations!!!"; 
 
\t \t wins++; 
 
\t \t updateWins(); 
 
\t \t gameOn=false; 
 
\t }else if (livesRemaining == 0){ 
 
\t \t livesRemaining == -1; 
 
\t \t document.getElementById("gameOver").innerHTML = "You have failed!"; 
 
\t \t losses++; 
 
\t \t updateLosses(); 
 
\t \t gameOn=false; 
 
\t }else{ 
 
\t \t document.getElementById("gameOver").innerHTML = "Good Luck!"; 
 
\t } 
 
} 
 

 
function checkPlayerChoiceNew(){ 
 
\t var splitWord = selectedWord.split(""); 
 
\t var choice = new RegExp(playerGuess); 
 
\t var compareWord = choice.test(selectedWord.toLowerCase()); 
 
\t var compareAlphabet = choice.test(remainingLetters); 
 
\t var compareRemovedList = choice.test(removedLetters); 
 
\t 
 
\t for (m = 0; m < splitWord.length; m++){ 
 
\t \t //alert(splitWord[m]); 
 
\t \t if(playerGuess == splitWord[m]){ 
 
\t \t \t document.getElementById(splitWord[m]).innerHTML = playerGuess; 
 
\t 
 
\t \t } 
 
\t } 
 
} 
 
//check playerGuess against selectedWord 
 
function checkPlayerChoice(){ 
 
\t var choice = new RegExp(playerGuess); 
 
\t var compareWord = choice.test(selectedWord.toLowerCase()); 
 
\t var compareAlphabet = choice.test(remainingLetters); 
 
\t var compareRemovedList = choice.test(removedLetters); 
 

 
\t if(compareWord == true && compareAlphabet == true){ 
 
\t \t document.getElementById("demo").innerHTML = playerGuess; 
 
\t \t 
 
\t \t remainingLetters.splice(remainingLetters.indexOf(playerGuess),1); 
 
\t \t displayAvailableLetters(); 
 
\t \t displayRemovedLetters(); 
 
\t \t score++; 
 
\t \t updateScore(); 
 
\t \t checkScore(); 
 
\t }else if(compareWord == true && compareAlphabet == false){ 
 
\t \t document.getElementById("demo").innerHTML = "Already tried that one"; 
 
\t }else if(compareWord == false && compareAlphabet == true){ 
 
\t \t livesRemaining--; 
 
\t \t document.getElementById("lives").innerHTML = livesRemaining; 
 
\t \t removedLetters.push(playerGuess.toLowerCase()); 
 
\t \t remainingLetters.splice(remainingLetters.indexOf(playerGuess),1); 
 
\t \t updateScore(); 
 
\t \t checkScore(); 
 
\t \t displayAvailableLetters(); 
 
\t \t displayRemovedLetters(); 
 
\t }else if (compareWord == false && compareAlphabet == false && compareRemovedList == true){ 
 
\t \t document.getElementById("demo").innerHTML = "Already tried that one ;)"; 
 
\t }else if (compareWord == false && compareAlphabet == false && compareRemovedList == true){ 
 

 
\t }else{ 
 
\t \t /*livesRemaining--; 
 
\t \t document.getElementById("lives").innerHTML = livesRemaining; 
 
\t \t removedLetters.push(playerGuess.toLowerCase()); 
 
\t \t updateScore(); 
 
\t \t checkScore(); 
 
\t \t displayAvailableLetters(); 
 
\t \t displayRemovedLetters();*/ 
 
\t \t document.getElementById("demo").innerHTML = "Not a Valid Key"; 
 
\t } 
 
} 
 

 

 

 

 

 
//document.onkeyup = function myKeyDown(event){ 
 
// \t playerGuess = event.key; 
 
\t 
 
//} 
 

 
//start/Restart the game 
 
function resetGame() { 
 
\t livesRemaining = 12; 
 
\t score =0; 
 
\t wordWorth = 0; 
 
\t clearTiles(); 
 
\t document.getElementById("lives").innerHTML = livesRemaining; 
 
\t chooseAWord(); 
 
\t printWord(); 
 
\t buildTiles(); 
 
\t refreshAlphabet(); 
 
\t gameOn=true; 
 
}
.tileStyle{ 
 
\t width:30px; 
 
\t height:30px; 
 
\t border:1px solid black; 
 
\t background-color:green; 
 
\t float:left; 
 
\t margin-left:10px; 
 
\t margin-right:10px; 
 
\t margin-bottom:10px; 
 
\t margin-top:10px; 
 
} 
 
.blankStyle{ 
 
\t width:30px; 
 
\t height:30px; 
 
\t background-color:orange; 
 
\t float:left; 
 
\t margin-left:10px; 
 
\t margin-right:10px; 
 
\t margin-bottom:10px; 
 
\t margin-top:10px; 
 
} 
 
.fixer{ 
 
\t width:100%; 
 
\t height:10px; 
 
\t clear:both; 
 
}
<body> 
 

 
<button onclick="checkPlayerChoice()">Try it</button> 
 

 
<p id="demo"></p> 
 

 
<p> lives: </p> 
 
<p id = "lives"> 0</p> 
 
<p> Score: </p> 
 
<p id = "scoreTotal">0</p> 
 
<p>wins</p> 
 
<p id ="winTotals">0</p> 
 
<p>losses</p> 
 
<p id ="lossTotals">0</p> 
 
<p id ="gameOver"></p> 
 

 
<button onclick ="resetGame()">New Game</button> 
 

 
<p>Here is the word</p> 
 
<p id = "wordDisplayer">Press New Game to Start</p> 
 
<div id = "wordTiles"></div> 
 
<div class ="fixer"></div> 
 

 
<button onclick ="checkPlayerGuess()">What Key was Pressed?</button> 
 
<p id ="isThisWorking">What will I say?</p> 
 

 
<p>Letters Still Available</p> 
 
<p id ="lettersStillAvailable"></p> 
 
<p>Bad Guesses</p> 
 
<p id ="lettersUsed"></p> 
 

 
<br />

selectedWord ="food"; 
 
function checkPlayerChoiceNew(){ 
 
\t var splitWord = selectedWord.split(""); 
 
\t var choice = new RegExp(playerGuess); 
 
\t var compareWord = choice.test(selectedWord.toLowerCase()); 
 
\t var compareAlphabet = choice.test(remainingLetters); 
 
\t var compareRemovedList = choice.test(removedLetters); 
 
\t 
 
\t for (m = 0; m < splitWord.length; m++){ 
 
\t \t //alert(splitWord[m]); 
 
\t \t if(playerGuess == splitWord[m]){ 
 
\t \t \t document.getElementById(splitWord[m]).innerHTML = choice; 
 
\t 
 
\t \t } 
 
\t } 
 
}

+0

你是什麼reg表達式'playerGuess'。 –

+0

它是一個全局變量,用於保存用戶通過按下鍵輸入的字母。我沒有發佈整個腳本,因爲它超過200行。如果我這樣做會有幫助嗎? – rmes

回答

0

您可以參考下面這樣的邏輯。在這個例子中,我給出了一些輸入。

var selectedWord ="food"; 
 
var displayString = []; 
 
for(var i = 0; i < selectedWord.length; i++){ 
 
    displayString[i] = "-" 
 
} 
 
var outputEle = document.getElementById("output"); 
 
var div = document.createElement('div'); 
 
div.innerText = displayString.join(" "); 
 
outputEle.appendChild(div); 
 
function checkPlayerChoiceNew(playerGuess){ 
 
    var newWord = ""; 
 
    var regExp = new RegExp(playerGuess,'ig') 
 
\t selectedWord.replace(regExp, function(value, index){ 
 
    displayString[index] = value; 
 
    return value; 
 
    }); 
 
    var div = document.createElement('div'); 
 
    div.innerText = displayString.join(" "); 
 
    outputEle.appendChild(div); 
 
    newWord = displayString.join(""); 
 
    if(selectedWord == newWord){ alert("You Won the game"); } 
 
    //outputEle.innerText = displayString.join(" "); 
 
} 
 
checkPlayerChoiceNew('o'); 
 
checkPlayerChoiceNew('g'); 
 
checkPlayerChoiceNew('d'); 
 
checkPlayerChoiceNew('f');
<div id="output"> 
 
    
 
</div>