2016-11-20 5 views
0

Mein Array:Passing Array Wert als Parameter verursacht undefined

 var alphabet = ['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']; 

Set-Funktion auf Button:

var alphabet = ['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']; 
 

 
for (var idx = 0; idx < alphabet.length; idx++) { 
 
    var bttn = document.createElement("button"); 
 
    bttn.innerText = alphabet[idx]; 
 
    bttn.onclick = function() { 
 
    this.disabled = true; 
 
    checkIfWordContainLetter(alphabet[idx]); 
 
    } 
 
    document.getElementById("hangmanContent").appendChild(bttn); 
 
} 
 

 
function checkIfWordContainLetter(letter) { 
 
    alert(wordToGuess); 
 
    alert(letter); 
 
}

Ursachen undefined wenn ich alphabet[idx] als Parameter übergeben, aber wenn ich pass zum Beispiel 'a' es Warnungen a.

+2

Diese Frage und Antwort sollte geschlossen werden. Bitte führen Sie meine Bearbeitung auf Ihrem Snippet und die Fehlermeldung sollte ausreichen, um das Problem selbst zu lösen :) –

+1

@ MatíasFidemraizer: Ich glaube nicht, dass das das Problem ist, über das sie sprechen. Natürlich muss dieses Element vorhanden sein und wurde nicht in den Beispielcode aufgenommen, aber das "undefined" wird wegen des * "function in a loop" * Problems angezeigt. –

+1

@squint Ach ja, und das wurde schon oft beantwortet. –

Antwort

1

Try unten Code:

var alphabet = ['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']; 
 
for(var idx=0;idx<alphabet.length;idx++) 
 
\t \t { 
 
\t \t \t var bttn = document.createElement("button"); 
 
\t \t \t bttn.innerText = alphabet[idx]; 
 
\t \t \t 
 
\t \t \t bttn.onclick = function() {this.disabled=true; 
 
\t \t \t 
 
\t \t \t checkIfWordContainLetter(this.innerText); 
 
\t \t \t } 
 
\t \t \t document.getElementById("hangmanContent").appendChild(bttn); 
 
\t \t } 
 

 

 

 
function checkIfWordContainLetter(letter) 
 
\t { \t \t 
 
\t \t alert(letter); 
 
\t \t alert(letter); 
 
\t \t 
 
\t }
<body> 
 
<div id="hangmanContent"></div> 
 
</body>

1

Dies ist ein Problem Bereiche zusammen.

Wenn Sie auf die Schaltfläche klicken, ist idx gleich 26, da die for bereits beendet ist, existiert dieser Index nicht auf Array.

Sie können diese Änderung var idx zu let idx einfach korrigieren, aber beachten Sie, dass dies nur in modernen Browsern implementiert ist.

könnte ein Vermächtnis Lösung sein:

for (var idx = 0; idx < alphabet.length; idx++) { 
    var bttn = document.createElement("button"); 
    bttn.innerText = alphabet[idx]; 
    bttn.onclick = (function (index) { 
     return function() { 
      this.disabled = true; 
      checkIfWordContainLetter(alphabet[index]); 
     } 
    } (idx)); 
    document.getElementById("hangmanContent").appendChild(bttn); 
} 

lesen: JavaScript closure inside loops – simple practical example

1

Hier Lösung:

var alphabet = ['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']; 
for(var idx=0;idx<alphabet.length;idx++) 
{ 
     var bttn = document.createElement("button"); 
     bttn.innerText = alphabet[idx]; 
     bttn.onclick = function (idx) 
     { 
      this.disabled=true; 
      checkIfWordContainLetter(alphabet[idx]); 
     }.bind(this, idx); 
     document.getElementById("hangmanContent").appendChild(bttn); 
} 

function checkIfWordContainLetter(button) 
{  
    //alert(wordToGuess); 
    alert(button.innerText); 

} 
1

Sie javaScript Schließung verstehen sollte. Wenn Sie auf eine dieser Schaltflächen geklickt haben, wird der Event-Handler ausgeführt. Sie haben die IDX im checkIfWordContainLetter(alphabet[idx]) als 1,2,3,4, ..... angezeigt. Es wird jedoch immer (alphabet.Länge + 1) sein. Sie alle beziehen sich auf den gleichen Ort in der Erinnerung.