Comment puis-je obtenir la fonctionnalité de « .hide() » de jQuery sans affecter les dimensions des éléments ?

Trouver des alternatives au .hide() de jQuery pour la visibilité : cachée

Dans jQuery, les développeurs ont la commodité d'utiliser .hide() et .show() pour manipuler la visibilité des éléments en définissant la propriété d'affichage CSS sur none. Cependant, lorsqu'il est nécessaire de définir la visibilité d'un élément sur caché sans modifier les dimensions de l'élément, trouver une fonction équivalente telle que .hide() peut poser un défi.

Développement de plugins personnalisés

Une approche consiste à créer un plugin jQuery personnalisé qui fournit la fonctionnalité souhaitée. L'exemple de code suivant illustre la création de trois plugins :

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

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

jQuery.fn.visibilityToggle = function() {
    return this.css('visibility', function(i, visibility) {
        return (visibility == 'visible') ? 'hidden' : 'visible';
    });
};

Avec ces plugins, vous pouvez utiliser les fonctions étendues visible(), invisible() et visibilitéToggle() pour contrôler directement la visibilité des éléments sans modifier leur taille physique.

Surcharge de la fonction jQuery toggle() originale

Pour ceux qui préfèrent une approche plus familière, il est possible de surcharger la fonction jQuery toggle() existante pour gérer le basculement de visibilité. Une méthode est :

!(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);

Cependant, cette approche n'est pas recommandée car elle modifie la fonction toggle() d'origine.

En fin de compte, que vous choisissiez de créer votre propre plugin ou de surcharger la bascule (), les solutions fournies offrent des fonctionnalités équivalentes à .hide() de jQuery pour modifier la visibilité des éléments via la propriété de visibilité.

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!