Javascript onclick
Introduction
JavaScript est un langage de programmation bien connu. Il est utilisé dans plus de 95% des sites Web avec lesquels nous interagissons quotidiennement. Vous pouvez souvent voir qu'en clics sur un bouton, une page entière est modifiée, un champ de formulaire est ouvert ou une boîte contextuelle apparaît. Du point de vue d'un programmeur / développeur, comment pouvons-nous implémenter de telles fonctionnalités et gérer les interactions du site Web avec les utilisateurs? En ce qui concerne l'interaction, JavaScript fournit des fonctions intégrées pour contrôler les événements sur un site.
Il existe deux types d'événements en JavaScript:
- Auditeur d'événements - écoute et attend que l'événement soit licencié
- Gestionnaire d'événements - exécuté lorsqu'un événement est licencié
Dans cet article, vous découvrirez le gestionnaire d'événements le plus utilisé de JavaScript, le sur clic événement. Il existe d'autres gestionnaires d'événements pour survoler un élément ou pour les pressions de touches de clavier, mais dans cet article, nous nous concentrerons sur l'événement OnClick.
L'événement OnClick est utilisé pour effectuer certaines tâches en cliquant sur un bouton ou en interagissant avec un élément HTML.
Nous allons maintenant vous montrer un exemple pour montrer comment fonctionne l'événement OnClick.
Exemple: modifiez le texte à l'aide d'ONClick
Dans cet exemple, nous modifierons une sélection de texte sur le clic d'un bouton à l'aide de l'événement OnClick. Tout d'abord, nous ferons une étiquette de paragraphe et lui donnerons un «paragraphe» d'identité pour y accéder plus tard. Nous allons créer un bouton avec l'événement OnClick et appeler la fonction nommée «Changer."
Linuxhint
Dans le fichier de script, nous créerons une variable de drapeau qui nous permettra de vérifier l'état du texte dans notre balise de paragraphe HTML. Ensuite, nous écrivons une fonction définissant la fonction «Changement». Dans la définition de la fonction, nous créerons une instruction «IF», dans laquelle nous vérifierons l'état à l'aide de la variable de l'indicateur. Nous allons également changer le texte et modifier le drapeau. C'est un morceau de code assez simple!
var a = 1;Fonction Change ()
if (a == 1)
document.GetElementByid ("paragraphe").innerhtml = "Linuxhint est génial"
a = 0;
autre
document.GetElementByid ("paragraphe").innerhtml = "Linuxhint"
a = 1;
D'accord! Après avoir écrit tout ce code, nous exécuterons le code, passerons à notre navigateur et cliquer sur le bouton nouvellement créé. Après avoir cliqué sur le bouton, le texte doit être passé de «Linuxhint» à «Linuxhint est génial."
Nous pouvons appliquer la même technique n'importe où pour modifier le contenu de notre site Web en fonction de nos besoins. Nous pouvons l'utiliser pour modifier une image ou effectuer n'importe quel type de tâche que nous pouvons imaginer avec cet outil.
Conclusion
Cet article explique comment utiliser l'événement OnClick. Dans cet article, vous avez appris le concept de la fonction onclick de manière pratique. L'utilisation de l'événement OnClick est si simple, même un débutant peut commencer à travailler avec cette fonction. Vous pouvez continuer à apprendre, travailler et acquérir plus d'expérience en JavaScript à Linuxhint.com pour avoir une meilleure compréhension de ce langage de programmation. Merci beaucoup!