web-dev-qa-db-fra.com

déclaration jQuery if pour vérifier la visibilité

J'essaie d'écrire un script qui cachera/affichera div en fonction de la visibilité des autres éléments. L'action doit avoir lieu lorsque je clique sur un autre élément. Voici ce que j'ai écrit jusqu'à présent:

$('#column-left form').hide();
    $('.show-search').click(function() {
        $('#column-left form').stop(true, true).slideToggle(300);
        if( $('#column-left form').css('display') == 'none' ) {
            $("#offers").show();
        } else {
            $('#offers').hide();
        }
    });

Cela cache la div, mais cela ne revient pas lorsque je cache le formulaire. Sera reconnaissant pour toute aide :)

modifier:

Ok, j'ai réussi à obtenir l'effet désiré en écrivant ceci:

$('#column-left form').hide();
    $('.show-search').click(function() {
        if ($('#column-left form').is(":hidden")) {
            $('#column-left form').slideToggle(300);
            $('#offers').hide();
        } else {
            $('#column-left form').slideToggle(300);
            $("#offers").show();
        }
    });

Je ne sais pas si c'est écrit correctement mais ça marche;) Merci à tous pour l'aide!

jqueryif-statementhideshowvisible
46
Tomarz

Vous pouvez utiliser .is(':visible') pour tester si quelque chose est visible et .is(':hidden') pour tester le contraire:

$('#offers').toggle(!$('#column-left form').is(':visible')); // or:
$('#offers').toggle($('#column-left form').is(':hidden'));

Référence:

119
ThiefMaster

Oui, vous pouvez utiliser .is(':visible') dans jQuery. Mais tant que le code est exécuté sous le navigateur Safari .is(':visible') ne fonctionnera pas. 

Alors s'il vous plaît utilisez le code ci-dessous 

if( $(".example").offset().top > 0 )

La ligne ci-dessus fonctionnera aussi bien IE que le safari.

4
Baskar Madasamy

essayer

if ($('#column-left form:visible').length > 0) { ...
2
kontur
 $('#column-left form').hide();
 $('.show-search').click(function() {
    $('#column-left form').stop(true, true).slideToggle(300); //this will slide but not hide that's why
    $('#column-left form').hide(); 
    if(!($('#column-left form').is(":visible"))) {
        $("#offers").show();
    } else {
        $('#offers').hide();
    }
  });
1
pravin

si visible.

$("#Element").is(':visible');

si c'est caché.

$("#Element").is(':hidden');
0
Nalan Madheswaran

Après avoir résolu un problème de performance lié à l'utilisation de .is (": visible"), je vous recommande de ne pas utiliser les réponses ci-dessus et d'utiliser le code de jQuery pour décider si un seul élément est visible:

$.expr.filters.visible($("#singleElementID")[0]);

.Is vérifie si un ensemble d’éléments se trouve dans un autre ensemble d’éléments. Vous chercherez donc votre élément dans l’ensemble des éléments visibles de votre page. Avoir 100 éléments est assez normal et peut prendre quelques millisecondes à parcourir le tableau des éléments visibles. Si vous construisez une application Web, vous en avez probablement des centaines, voire des milliers. Notre application prenait parfois 100 ms pour $ ("# sélecteur"). Is (": visible") car elle vérifiait si un élément figurait dans un tableau de 5000 autres éléments.

0
markdon