how - if have element jquery

jQuery if declaración para verificar la visibilidad

Question

Intento escribir un script que oculte / muestre div dependiendo de la visibilidad de otros elementos. La acción debería tener lugar cuando hago clic en otro elemento. Esto es lo que he escrito hasta ahora:

$(''#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();
        }
    });

Oculta el div, pero no vuelve cuando oculto el formulario. Será muy agradecido por cualquier ayuda :)

editar:

Ok, logré lograr el efecto deseado escribiendo esto:

$(''#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();
        }
    });   

No sé si está escrito correctamente, pero funciona;) ¡Gracias a todos por su ayuda!

Answer 1

Después de solucionar un problema de rendimiento relacionado con el uso de .is (": visible"), recomendaría las respuestas anteriores y, en su lugar, usaré el código de jQuery para decidir si un elemento está visible:

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

Lo que hace .is es comprobar si un conjunto de elementos está dentro de otro conjunto de elementos. Por lo tanto, buscará su elemento dentro del conjunto completo de elementos visibles en su página. Tener 100 elementos es bastante normal y puede tomar unos pocos milisegundos para buscar a través de la matriz de elementos visibles. Si está construyendo una aplicación web, probablemente tenga cientos o posiblemente miles. Nuestra aplicación a veces tomaba 100ms por $ ("# selector"). Is (": visible") ya que estaba comprobando si un elemento estaba en una matriz de otros 5000 elementos.

Answer 2

Puedes usar .is('':visible'') para probar si algo está visible y .is('':hidden'') para probar lo contrario:

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

Referencia:

• http://api.jquery.com/is/
• http://api.jquery.com/visible-selector/
• http://api.jquery.com/hidden-selector/

Answer 3

Sí, puedes usar .is('':visible'') en jquery. Pero mientras el código se ejecuta bajo el navegador safari .is('':visible'') no funcionará.

Así que usa el código a continuación

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

La línea anterior funcionará tanto en IE como en Safari.

Answer 4

si es visible

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

si está escondido

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

Answer 5

tratar

if ($(''#column-left form:visible'').length > 0) { ...

Answer 6

 $(''#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();
    }
  });