Ajout du gestionnaire d'événement onfocus à chaque élément

Question

Je reçois un message non défini sur tous mes gestionnaires. Je veux lier un gestionnaire à chaque élément et je veux afficher la valeur. Quel est le problème avec ce code? Merci!

for (var i = 0; i < document.forms[0].elements.length; i++){ 
    document.forms[0].elements[i].onfocus = test(this); 
} 

function test(ele){ 
    alert(ele.value); 

} 

Answer 1

Vous devez affecter une fonction. Pour le moment, vous affectez la valeur de retour test(window) qui est undefined.

onfocus = test; 

la référence Puis l'élément intérieur de la fonction:

function test(){ 
    alert(this.value); 
} 

Answer 2

Vous devez changer à la fois l'affectation et la fonction, étant donné que l'élément ne sera plus transmis comme un paramètre, comme ceci:

for (var i = 0; i < document.forms[0].elements.length; i++){ 
    document.forms[0].elements[i].onfocus = test; 
} 
function test(){ 
    alert(this.value); 
} 

en tant que gestionnaire d'événements, this l'intérieur test se référera à l'élément que vous avez affaire, si juste obtenir la valeur de cela.

---

La version alternative de votre approche actuelle serait la même méthode test, mais avec une enveloppe de fonction anonyme pour passer l'élément lui-même comme un paramètre:

for (var i = 0; i < document.forms[0].elements.length; i++){ 
    ddocument.forms[0].elements[i].onfocus = function() { test(this); }; 
} 
function test(ele){ 
    alert(ele.value); 
} 

Answer 3

Comme Nick et David ont fait remarquer , la façon dont vous affectez le gestionnaire d'événements est incorrecte. Cependant, pour réaliser ce que vous essayez (passer dans un contexte), vous pouvez utiliser une fonction de délégué. Comme ceci:

for (var i = 0; i < document.forms[0].elements.length; i++){ 
    var ele = document.forms[0].elements[i]; 
    ele.onfocus = delegate(ele, test); 
} 

function delegate(obj, handler) { 
    return function() { 
    handler.call(obj); 
    } 
} 

function test() { 
    alert(this.value); 
} 

Qu'est-ce que la fonction delegate fait, est d'appeler la fonction de gestionnaire définir le contexte de this. Voir la documentation du Function object pour plus d'informations. Pour encore plus de lecture, je recommande The this keyword et Introduction to events sur Quirksmode.