11036 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous Smiley cligne ,
petit sujet qui sera (je le pense et l'espère) sera rapide.
J'ai créé une petite fonction qui permet, au click d'un lien, de donner son id.

<a href="#" id="salut" onclick="fonction()">salu</a>


function fonction() {
   alert(this.id);
}

sauf que, au lieu de me remettre l'id, ben ca me met "undefined"
on va pas se mytho, je m'y attendais un peu Smiley fache Smiley ohwell
Modifié par Swann_68 (08 Jan 2021 - 21:13)
Modérateur
Bonjour,

"this" dans la fonction vaut ici l'objet "window" et non pas l'élément sur lequel tu cliques, parce que ta fonction est définie au niveau global (en d'autres termes, ta fonction "appartient" à l'objet "window").

Une possibilité parmi d'autres consiste à passer "this" en paramètre de la fonction, par exemple comme ça :
<a href="#" id="salut" onclick="fonction(this)">salut</a>

function fonction(a) {
    alert(a.id);
}


Une autre possibilité est d'utiliser la méthode addEventListener() pour ajouter la fonction à exécuter lors d'un clic. Et dans ce cas tu n'as plus besoin d'utiliser l'attribut "onclick". De plus, "this" vaudra l'élément sur lequel tu cliques car la fonction "appartiendra" à cet élément. Par exemple :
<a href="#" id="salut">salut</a>

document.getElementById("salut").addEventListener("click",
	function() {
		alert(this.id);
	});

La 2e solution est préférable à la 1re.

Amicalement,
Meilleure solution