Hangman Spiel vergleicht den Buchstaben des Benutzers ausgewählt mit den Buchstaben im Wort zu werden

Dies ist ein einfaches Henker Spiel ich machte eine alphabet Tastatur durch Tasten, so onclick es sollte die Funktion checkLetter zu überprüfen, ob der Buchstabe in der ausgewählt Wort zu erraten oder nicht diesen Teil es nicht ausgeführt, auch, wie man den Brief auf der Schaltfläche zu löschen, wenn der Benutzer darauf geklickt hat, damit er ihn wieder auswählen ?!
dies mein Code mit html beginnen dann Javascript Hangman Spiel vergleicht den Buchstaben des Benutzers ausgewählt mit den Buchstaben im Wort zu werden

var B 
 
    ,L 
 
    ,placeholder 
 
    ,correctGuesses 
 
    ,wrongGuesses 
 
    ,wordToGuess 
 
    ,wordLength 
 
    ,words=[] 
 
    ,wrongletter=true; 
 

 
    function newGame() 
 
    { 
 
     //initialize all the variables 
 
     placeholder=""; 
 
     correctGuesses=0; 
 
     wrongGuesses=0; 
 
     wordToGuess=getWord(); 
 
     wordLength=wordToGuess.length; 
 
     
 
     //make a loop that replaces underscores with the word to be guessed 
 
     for(var i=0;i<wordLength;i++) 
 
     { 
 
     \t placeholder+="_ "; 
 
     } 
 
     document.getElementById("placeforword").innerHTML=placeholder; 
 
     
 
     //loop to make a keyboard of buttons 
 
     //B hold the buttons 
 
    B = ''; 
 
    //L hold letters 
 
    L; 
 
    //this loop to get the letters by charcode 
 
    for (var i = 65; 90 >= i; i++) {// A-65, Z-90 
 
     L = String.fromCharCode(i); 
 
     B += '<button id="B2" onclick="getLetter(\''+L+'\');">' + L + '</button>'; 
 
    } 
 
    document.getElementById("box1").innerHTML = B; 
 
    drawCanvas(); 
 
    } 
 
    function getLetter(x) 
 
    { 
 
     checkLetter(x); 
 
    } 
 
    function checkLetter(letter) 
 
    { 
 
    \t document.getElementById("placeforword").innerHTML=placeholder; 
 
     placeholder=placeholder.split(""); 
 
       for(var i=0;i<wordLength;i++) 
 
      { 
 
      \t if(wordToGuess.charAt(i)===letter.toLowerCase()) 
 
      \t { 
 
       placeholder[i]=letter; 
 
       wrongletter=false; 
 
       correctGuesses++; 
 
      \t } 
 
      \t if(correctGuesses===wordLength) 
 
      \t { 
 
      \t \t //if all letters have been guessed that mean u guessed all the correct letters and u win 
 
      \t \t //call the drawCanvas 
 
      \t \t drawCanvas(); 
 
    
 
      \t } 
 
      } 
 
      \t //if ur guess was wrong 
 
    \t if(wrongGuess) 
 
    \t { 
 
    \t \t badGuesses++; 
 
    \t \t drawCanvas();//this function to draw the body of the victim 
 
    \t } 
 
    \t document.getElementById("placeforword").innerHTML=placeholder.join(""); 
 
     
 
    } 
 
function getWord() 
 
{ 
 
\t var a=["bad","happy","anyotherwords"]; 
 
\t //choose a random word 
 
\t return a[parseInt(Math.random()*a.length)]; 
 
}

<html> 
 

 
<head> 
 
    <title>New Game</title> 
 
    <style type="text/css"> 
 
    #B1 { 
 
     background-color: #4CAF50; 
 
     color: white; 
 
     font-size: 24px; 
 
    } 
 
    #box2 { 
 
     width: 350px; 
 
     height: 350px; 
 
     padding: 10px; 
 
     background-color: blue; 
 
     text-align: center; 
 
    } 
 
    </style> 
 
</head> 
 

 
<body> 
 
    <div id="container" style="width:100%;"> 
 
    <div id="left" style="float:left;width:50%;"> 
 
     <div id="newgame"> 
 
     <button onclick="newGame()" id="B1">New Game</button> 
 
     <br> 
 
     <br> 
 
     </div> 
 
     <!--<div id="newgame1"></div>--> 
 
     <div id="box1"></div> 
 
     <div> 
 
     <p id="placeforword"></p> 
 
     </div> 
 
     <div id="box2"> 
 
     <h1>Letters u Guessed</h1> 
 
     </div> 
 
    </div> 
 
    <div id="right" style="float:right;width:50%;"> 
 
     <div> 
 
     <canvas id="stage" width="643" height="643" style="border:5px solid #000000;"></canvas> 
 
     </div> 
 
    </div> 
 
    </div>

Quelle

2016-04-14 emma

Bitte Interpunktion verwenden. Ich verstehe, dass Englisch nicht die erste Sprache vieler Benutzer ist, aber Ihre Frage ist fast nicht lesbar. –

sollte Ihre Taste-ID eindeutig sein. So ist die for-Schleife ändern, den Knopf zu

for (var i = 65; 90 >= i; i++) {// A-65, Z-90 
    L = String.fromCharCode(i); 
    B += '<button id="'+L+'" onclick="getLetter(\''+L+'\');">' + L + '</button>'; 
}

Und in getLetter() Funktion erstellt können Sie die Taste deaktivieren,

function getLetter(x) 
{ 
    checkLetter(x); 
    document.getElementById(x).disabled = true; 
}

Quelle

2016-04-14 15:38:52 Munawir

Es hat nicht funktioniert, nur ein Buchstabe mit Unterstrich ersetzt und der Knopf ist nicht – emma

deaktivieren etwas falsch mit dem Rest meines Code? !! – emma

Es hat sich mit dem 'in meinem Code kleiner Fehler gewesen" 'Marke, auf'

Überarbeitete mit Ihrem Code. Die Änderungen werden am Snippet selbst kommentiert.

Meine Kommentare sind zwischen ///////// und \\\\\\\\\\\ für ein einfaches Verständnis platziert.

Die drawCanvas() Funktion wurde kommentiert, weil es nicht definiert ist.

var B 
 
    ,L 
 
    ,placeholder 
 
    ,correctGuesses 
 
    ,wrongGuesses 
 
    ,wordToGuess 
 
    ,wordLength 
 
    ,words=[] 
 
    ,wrongletter=true; 
 

 
    function newGame() 
 
    { 
 
     //initialize all the variables 
 
     placeholder=[]; /////////initialize placeholder as an array\\\\\\\\\\\ 
 
     correctGuesses=0; 
 
     wrongGuesses=0; 
 
     wordToGuess=getWord(); 
 
     wordLength=wordToGuess.length; 
 
     
 
     //make a loop that replaces underscores with the word to be guessed 
 
     for(var i=0;i<wordLength;i++) 
 
     { 
 
     \t placeholder[i] = "_ "; /////////instead of concatinating string add '_' to placeholder array\\\\\\\\\\\ 
 
     } 
 
     document.getElementById("placeforword").innerHTML=placeholder.join(""); 
 
     
 
     //loop to make a keyboard of buttons 
 
     //B hold the buttons 
 
    B = ''; 
 
    //L hold letters 
 
    L; 
 
    //this loop to get the letters by charcode 
 
    for (var i = 65; 90 >= i; i++) {// A-65, Z-90 
 
     L = String.fromCharCode(i); 
 
     B += '<button id="'+L+'" onclick="getLetter(\''+L+'\');">' + L + '</button>'; /////////button id should be unique. So give each button with letter as id \\\\\\\\\\\ 
 
    } 
 
    document.getElementById("box1").innerHTML = B; 
 
    //drawCanvas(); 
 
    } 
 
    function getLetter(x) 
 
    { 
 
     document.getElementById(x).disabled = true; /////////disable button that clicked\\\\\\\\\\\ 
 
     checkLetter(x); 
 
    } 
 
    function checkLetter(letter) 
 
    { 
 
     wrongletter=true; 
 
    \t document.getElementById("placeforword").innerHTML=placeholder; 
 
//  placeholder=placeholder.split(""); /////////no need this since the placeholder is now an array\\\\\\\\\\\ 
 
       for(var i=0;i<wordLength;i++) 
 
      { 
 
      \t if(wordToGuess.charAt(i)===letter.toLowerCase()) 
 
      \t { 
 
       placeholder[i]=letter; 
 
       wrongletter=false; 
 
       correctGuesses++; 
 
      \t } 
 
      \t if(correctGuesses===wordLength) 
 
      \t { 
 
      \t \t //if all letters have been guessed that mean u guessed all the correct letters and u win 
 
      \t \t //call the drawCanvas 
 
      \t \t //drawCanvas(); 
 
    
 
      \t } 
 
      } 
 
      \t //if ur guess was wrong 
 
    \t if(wrongletter) /////////I think you mistakenly gave the variable name here\\\\\\\\\\\ 
 
    \t { 
 
    \t \t wrongGuesses++; /////////I think you mistakenly gave the variable name here\\\\\\\\\\\ 
 
    \t \t //drawCanvas();//this function to draw the body of the victim 
 
    \t } 
 
    \t document.getElementById("placeforword").innerHTML=placeholder.join(""); 
 
     
 
    } 
 
function getWord() 
 
{ 
 
\t var a=["bad","happy","anyotherwords"]; 
 
\t //choose a random word 
 
\t return a[parseInt(Math.random()*a.length)]; 
 
}

<html> 
 

 
<head> 
 
    <title>New Game</title> 
 
    <style type="text/css"> 
 
    #B1 { 
 
     background-color: #4CAF50; 
 
     color: white; 
 
     font-size: 24px; 
 
    } 
 
    #box2 { 
 
     width: 350px; 
 
     height: 350px; 
 
     padding: 10px; 
 
     background-color: blue; 
 
     text-align: center; 
 
    } 
 
    </style> 
 
</head> 
 

 
<body> 
 
    <div id="container" style="width:100%;"> 
 
    <div id="left" style="float:left;width:50%;"> 
 
     <div id="newgame"> 
 
     <button onclick="newGame()" id="B1">New Game</button> 
 
     <br> 
 
     <br> 
 
     </div> 
 
     <!--<div id="newgame1"></div>--> 
 
     <div id="box1"></div> 
 
     <div> 
 
     <p id="placeforword"></p> 
 
     </div> 
 
     <div id="box2"> 
 
     <h1>Letters u Guessed</h1> 
 
     </div> 
 
    </div> 
 
    <div id="right" style="float:right;width:50%;"> 
 
     <div> 
 
     <canvas id="stage" width="643" height="643" style="border:5px solid #000000;"></canvas> 
 
     </div> 
 
    </div> 
 
    </div>

Quelle

2016-04-14 17:12:11 Munawir

Hangman Spiel vergleicht den Buchstaben des Benutzers ausgewählt mit den Buchstaben im Wort zu werden

Antwort

Verwandte Themen