Maison > interface Web > Questions et réponses frontales > jquery définit le bouton caché

jquery définit le bouton caché

PHPz
Libérer: 2023-05-28 10:42:08
original
1520 Les gens l'ont consulté

JQuery est une bibliothèque JavaScript rapide et concise qui simplifie la programmation pour une variété de tâches, y compris la définition de boutons masqués. Cet article explique comment utiliser JQuery pour définir un bouton masqué.

  1. Tout d'abord, créez un élément bouton dans la page HTML. Le bouton peut être un élément de type d'entrée "bouton" ou un élément de balise "a".



  1. Ajouter un écouteur d'événement en Javascript au bouton effectue le fonction requise lorsque vous cliquez dessus. Utilisez le sélecteur JQuery pour sélectionner le bouton correspondant.

$('#myButton').click(function() {
// votre code ici
});

  1. Dans le gestionnaire d'événements, utilisez le sélecteur JQuery et la méthode .toggle() pour exécuter sur le bouton Masquer/afficher les opérations. La méthode Toggle() bascule la visibilité du bouton en fonction de son état actuel. Si le bouton est masqué, cette méthode affichera le bouton. Cette méthode masque le bouton s'il est déjà affiché.

$('#myButton').click(function() {
$('#myButton').toggle();
});

  1. Si vous avez besoin d'animer le bouton, vous pouvez utiliser .toggle () paramètres de la méthode. Vous pouvez utiliser « lent » ou « rapide » pour spécifier la durée de l'animation, ou vous pouvez utiliser une valeur numérique pour spécifier la durée en millisecondes.

$('#myButton').click(function() {
$('#myButton').toggle('fast');
});

  1. Si vous devez exécuter un autre code lorsque le bouton est masqué, vous pouvez utiliser la fonction de rappel de JQuery. Passez la fonction de rappel comme deuxième paramètre de la méthode .toggle().

$('#myButton').click(function() {
$('#myButton').toggle('fast', function() {

alert('按钮现在已经被隐藏了。');
Copier après la connexion
Copier après la connexion

});
});

  1. sauf En plus de la méthode .toggle(), JQuery fournit également les méthodes .show() et .hide() pour afficher et masquer les éléments respectivement.

$('#myButton').click(function() {
$('#myButton').hide('fast', function() {

alert('按钮现在已经被隐藏了。');
Copier après la connexion
Copier après la connexion

});
});

  1. Enfin , si vous devez utiliser des classes CSS lors du masquage/affichage, vous pouvez utiliser les méthodes .addClass() et .removeClass(). Ces méthodes ajouteront ou supprimeront les classes CSS spécifiées à l'élément.

$('#myButton').click(function() {
$('#myButton').addClass('hidden');
});

La configuration des boutons cachés devient facile en utilisant JQuery, et peut être facilement intégré à d’autres codes JavaScript.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal