Comment puis-je déclencher des fonctions JavaScript à partir de boutons HTML ?

Comment appeler des fonctions JavaScript à l'aide de boutons HTML

Pour interfacer avec le code JavaScript, les boutons HTML offrent une solution pratique. Lorsqu'un bouton est cliqué, le navigateur exécute la fonction JavaScript associée.

Gestion des événements définis par HTML

Une approche consiste à spécifier l'appel de fonction directement dans le code HTML. :

<input type="button" value="Capacity Chart" onclick="CapacityChart();">

Propriété d'événement DOM Manipulation

Vous pouvez également attribuer le gestionnaire d'événements à la propriété DOM à l'aide de JavaScript :

document.getElementById("clickMe").onclick = function () { /* ... */ };

Pièce jointe de l'écouteur d'événement

Une autre l'option est d'attacher une fonction à l'événement écouteur :

var el = document.getElementById("clickMe");
el.addEventListener("click", function () { /* ... */ }, false);

Dépannage de l'appel de bouton

Considérez les points suivants lors du débogage de l'appel d'événement de bouton :

• Assurez-vous de la fonction CapacitéChart() est défini correctement.
• Vérifiez les erreurs dans le script lui-même.
• Envisagez de modifier la ligne document.write() en :

CapacityWindow.document.open("text/html");
CapacityWindow.document.write(s);
CapacityWindow.document.close();

Compatibilité entre navigateurs

Pour prendre en charge plusieurs navigateurs, remplacez les références document.all par document.getElementById.

Notes supplémentaires

• Les trois méthodes de gestion des événements mentionnées ne s'excluent pas mutuellement.
• La première est déconseillée car elle est non conforme à XHTML.
• Les deuxième et troisième méthodes permettent des fonctions anonymes et définition d'événement post-analyse d'élément.
• La troisième méthode permet d'attacher plusieurs fonctions au même gestionnaire d'événements.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!