Comment Insérer Du Code Dans Un Bouton

Table des matières:

Comment Insérer Du Code Dans Un Bouton
Comment Insérer Du Code Dans Un Bouton

Vidéo: Comment Insérer Du Code Dans Un Bouton

Vidéo: Comment Insérer Du Code Dans Un Bouton
Vidéo: CRÉER UN BEAU BOUTON EN HTML ET CSS 2024, Novembre
Anonim

Les boutons des pages Web sont utilisés pour offrir une expérience utilisateur interactive. En règle générale, si la réponse à un clic sur un bouton ne nécessite pas l'envoi de données au serveur, l'interaction est mise en œuvre à l'aide de scripts JavaScript. Les méthodes d'appel du code JavaScript correspondant peuvent varier. Vous trouverez ci-dessous plusieurs options possibles pour les boutons de différents types.

Comment insérer du code dans un bouton
Comment insérer du code dans un bouton

Instructions

Étape 1

Si l'affichage d'un bouton dans une page Web est organisé à l'aide de la balise button, alors le code JavaScript peut être placé dans l'attribut onclick. Par exemple, comme ceci: button Bien sûr, il n'est pas conseillé de mettre un code suffisamment gros directement dans la balise button - il est préférable de la concevoir comme une fonction et de mettre uniquement le code pour appeler cette fonction dans l'attribut onclick. Par example:

fonction showAlert () {

alerte ('Bouton cliqué !')

}

bouton

Étape 2

Si le bouton est affiché via l'une des variantes de la balise d'entrée (soumettre, réinitialiser, bouton ou image), le même attribut onclick peut être utilisé. Par exemple, pour qu'un bouton efface des champs de formulaire (réinitialisation), le code peut ressembler à ceci: fonction ou directement à l'attribut onclick false. Par example:

Étape 3

Si vous avez besoin d'organiser une réponse à un clic sur un bouton du type de soumission, alors, en plus de la méthode ci-dessus utilisant l'attribut onclick, vous pouvez utiliser les propriétés de la balise de formulaire à laquelle appartient ce bouton. L'appel de fonction correspondant peut être placé dans l'attribut onsubmit de la balise form. Par example:

Étape 4

Si le bouton n'est pas un élément de formulaire, mais simplement un élément graphique (balise img), alors les normes pour cela autorisent également l'utilisation de l'attribut onclick. Par example:

Étape 5

Si le bouton est un lien hypertexte, vous ne devez pas utiliser les attributs du bouton lui-même; il est préférable d'utiliser les propriétés de la balise de lien. Vous pouvez, comme dans les options précédentes, utiliser la balise onclick. Par exemple: Et vous pouvez remplacer l'adresse dans l'attribut href par un appel de fonction. Par exemple, comme ceci:

Conseillé: