Comment puis-je contrôler la visibilité des éléments en utilisant « visibilité : cachée » au lieu du .hide() de jQuery ?

Atteindre la visibilité : explorer des alternatives à la méthode .hide() de jQuery

Dans le domaine du développement frontend, la méthode .hide() de jQuery a a pris de l'importance en tant que moyen pratique de basculer la visibilité des éléments à l'aide de « affichage : aucun ». Cependant, que se passe-t-il si vous recherchez une solution qui exploite la propriété « visibilité : cachée » ?

Heureusement, il existe des moyens d'imiter la syntaxe concise de .hide() tout en modifiant la visibilité d'un élément à l'aide du CSS préféré. paramètre. La clé réside dans la création de plugins personnalisés :

jQuery.fn.visible = function() {
    return this.css('visibility', 'visible');
};

jQuery.fn.invisible = function() {
    return this.css('visibility', 'hidden');
};

Ces plugins fournissent des fonctions simples pour définir la visibilité sur "visible" ou "cachée".

Si vous désirez une approche plus polyvalente, envisagez en modifiant la fonction toggle() intégrée de jQuery :

!(function($) {
    var toggle = $.fn.toggle;
    $.fn.toggle = function() {
        var args = $.makeArray(arguments),
            lastArg = args.pop();

        if (lastArg == 'visibility') {
            return this.visibilityToggle();
        }

        return toggle.apply(this, arguments);
    };
})(jQuery);

Cette modification étend toggle() pour accepter "visibilité" comme argument, ce qui permet de basculer entre les états visible et caché.

Avec ces solutions à votre disposition, vous pouvez facilement gérer la visibilité des éléments à l'aide de la propriété "visibility: Hidden", offrant une alternative flexible à la méthode .hide() de jQuery.

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!