Cours Web

Réalisation de sites Internet Lausanne

addEvent

La fonction addEvent permet d'ajouter un détecteur d'évenement sur une balise html du document. Elle est l'équivalent d'un attribut évennementiel placé dans une balise, par exemple:

<a href='...' onclick='une_fonction();'>Un lien</a>

Ici, on a un onclick qui permet d'executer une fonction javascript si on clique sur le lien. Cela implique que l'on puisse ajouter le onclick dans le code.

Dans certains cas, le code html qui doit détecter l'évennement n'est pas modifiable, par exemple si ce code se trouve dans un modèle dreamweaver. Dans ce cas la fonction addEvent permet de liéer l'évenement dynamiquement (à l'execution), sans avoir besoin de modifier le code html qui doit détecter l'évennement.

function addEvent(obj, evType, fn) {
	if (obj.addEventListener){
    	obj.addEventListener(evType, fn, true);
		return true;
	} else if (obj.attachEvent){
		var r = obj.attachEvent("on"+evType, fn);
		return r;
	} else {
		return false;
	}
}

Cette fonction travail differemment suivant le type de navigateur, mais elle produit le même résultat. Voici un exemple d'utilisation de addEvent qui permet d'appeler une fonction javascript lorsque la page a fini d'être chargée.

addEvent(window, 'load', 
  function() {
    document.getElementById('prenom').focus(); 
  } 
);

Dans cet exemple, la fonction appelée au chargement de la page donne le focus à au premier champ (prenom) d'un formulaire.