jQuery es (': visible') actuando de forma divertida.

Me encuentro con un problema extraño al probar la visibilidad de un objeto con jQuery.jQuery es (': visible') actuando de forma divertida.

tengo unas pocas cosas JS prueba:

alert($myObject.css('display')); 
alert($myObject.is(':visible'));

La primera alerta muestra 'bloque' que tiene sentido como Firebug muestra claramente que se establece en display: block y se puede ver el objeto en la página en el navegador.

La segunda alerta, sin embargo, muestra 'falso'. Lo cual no tiene ningún sentido para mí en absoluto.

¿Estoy entendiendo mal el uso de es (': visible')?

Fuente

2012-03-19 DA.

¿Puedes dar una muestra del código en jsfiddle? un margen de beneficio más ayudará – redDevil

¿Está diciendo que su elemento * es * visible en la página, pero '.is (': visible')' es falso? La respuesta de @KARASZI es correcta, pero si su elemento es realmente visible, este podría ser un problema diferente. ¿Puedes publicar un violín replicando el problema? – nrabinowitz

@ j08691 si el objeto está configurado para mostrar: bloquear, y puedo verlo, espero que la declaración is() devuelva TRUE en este caso. –

consideran este HTML:

<div id="div1" style="display: none;"> 
    <div id="div2"> 
     <p>Some div content</p> 
    </div> 
</div>

y esto JavaScript:

$myObject = jQuery('#div2'); 
alert($myObject.css('display')); // 'block' 
alert($myObject.is(':visible')); // false

Existen múltiples razones $myObject pueden no ser visibles, a pesar de que tiene display: none conjunto de estilos. Vea :visible selector docs para más detalles.

¿Tiene sentido ahora?

Fuente

2012-03-19 16:17:18 Tadeck

excepto que puedo ver mi objeto en el navegador, su padre no está oculto. –

@DA .: ¿Estás completamente seguro? Intenta manipular '$ myObject' utilizando JavaScript (por ej., Establece su borde en rojo) y dinos si el resultado es el esperado. Si la manipulación '$ myObject' cambia lo que ves en el navegador, entonces danos más detalles: trata de reducir el problema extrayendo el código que muestra los resultados exactos, y muéstranos este código. – Tadeck

sí, ya hizo todo el BORDER hack para ver si es el objeto correcto. Intentaré desmantelar la página para ver si puedo encontrar el origen del problema y publicar el marcado. –

El selector :visible no es equivalente con la propiedad display css.

De la documentación vinculada, es visible cuando false:

tienen un valor de visualización de CSS ninguno.
Son elementos de formulario con type = "hidden".
Su ancho y alto están explícitamente establecidos en 0.
Un elemento ancestro está oculto, por lo que el elemento no se muestra en la página.

Fuente

2012-03-19 16:16:38

Entendido. Ninguno de esos son ciertos en esta situación. Está configurado para mostrar: bloque, no es un elemento de formulario oculto, no tiene un alto o ancho explícito de cero y puedes verlo en la página (por lo que su antecesor no parece estar oculto) –

Espero con interés la jsEn el enlace de enlace, tengo mucha curiosidad sobre la causa del problema. –

He agregado una respuesta que explica lo que sucedió. Estoy un poco avergonzado. ;) –

De la documentación :visible Selector:

elementos pueden ser considerados oculto por varias razones:

tienen un valor de visualización de CSS ninguno.

Son elementos de formulario con type = "hidden".

Su ancho y alto están explícitamente establecidos en 0.

Un elemento ancestro está oculto, por lo que el elemento no se muestra en la página.

Compruebe que ninguna de estas otras condiciones sea verdadera.

Fuente

2012-03-19 16:17:21

Por lo tanto, la respuesta:

Si alguien se conecta un evento de clic a su objeto que antes desconocíamos, ese evento puede ser arruinando cualquier lógica que estaba tratando de usar.;)

Por desgracia, eso es lo que sucedió aquí. Se ha adjuntado otro evento de clic a este objeto que se configuró para ocultar su elemento principal. Eso fue disparar primero, antes de que mi lógica se comprobara para ver si era visible.

Al final: error de usuario.

Debería haber alguna forma de penalización de reputación cuando se trata de un problema de error del usuario. ;)

Fuente

2012-03-19 23:53:11

Gracias por compartir. –

jQuery es (': visible') actuando de forma divertida.

Respuesta

Cuestiones relacionadas