Accéder à des fonctions à partir d'un objet Javascript (Javascript)

Question

J'essaye de créer un programme de base du pendu. C'est un tableau d'étiquettes qui sont assignées dans un tableau d'objets (appelés boutons). Chaque image est une image d'une lettre, donc par exemple vous devez appuyer sur le bouton 'L', il vérifiera si c'était dans un tableau de mots (qui est un tableau de caractères), alors il agirait en conséquence (pour cacher la lettre, puis mettez à jour l'image de la potence si nécessaire).

Je n'arrive pas à obtenir la méthode onclick des images pour accéder à la fonction checkinarray. Qu'est-ce que je fais mal?

var LetterAmount = 3; //make this 26. checked. 
var WordArray = new Array(); 
var Buttons = new Array(); 

function checkinarray(num){ 
var z = 0; 
while (z<4){ 
    document.write("looping through word now"); 
    if (num == WordArray[z]){ 
    document.write("<br/>it is in the word"); 
    } 
    z++; 
    } 
} 

function ButtonClicked(){ 
this.Image.src = "images/blank.jpg"; 
checkinarray(this.Number); 
} 
function Button(Image, Number) { 
this.Image = Image; 
this.Number = Number; 
this.ButtonClicked = ButtonClicked; 
} 
function initialiseletters(){ 
var x; 
//set up empty img tags for use 
    for(i = 0; i < LetterAmount; i++) { 
    document.write("<img id=" + i + ">"); 
    } 
    for(x = 0; x < LetterAmount; x++) { 
    document.images[x].src = "images/" + x + ".jpg"; 
    document.getElementById(x).onclick =function(){ 
    Buttons[this.id].ButtonClicked(); 
    } 
Buttons[x] = new Button(document.images[x], "" + x); 
} 
} 

function initialiseword(){ 
//WordArray = new Array(); 
WordArray[0] = 0; 
WordArray[1] = 1; 
WordArray[2] = 2; 
WordArray[3] = 3; 
} 

function initialise(){ 
initialiseword(); 
initialiseletters(); 
document.write("testing overall"); 
} 

Answer 1

document.getElementById(x).onclick =function(){ 
    Buttons[this.id].ButtonClicked(); 
    } 

Où est votre problème. 'this.id' est indéfini. Document.write n'est pas un bon moyen d'ajouter des éléments au DOM ... Essayez document.createElement ('img');

Ensuite, vous avez déjà référence à l'image comme ceci:

var img = document.createElement('img'); 
img.onclick = function() 
{ 
    //your click... 
} 
//add it to the view stack 
document.body.appendChild(img); 

Answer 2

Je ne vois pas un problème avec ButtonClicked appeler checkinarray, mais je vois un problème avec checkinarray - qu'il appelle document.write après le rendu des pages est complète (par exemple, lorsque l'utilisateur clique), qui a gagné ne fonctionne pas. Vous devez modifier le DOM via les méthodes DOM (cela sera beaucoup plus facile si vous utilisez une boîte à outils comme Prototype, jQuery, MooTools, Dojo, la bibliothèque de fermeture, YUI, etc.).