2011-12-13 18 views
34

Ésta es mi divComprobar div se oculta usando jQuery

<div id="car2" style="display:none;"></div> 

entonces tengo un botón Mostrar que mostrará el div al hacer clic en:

$("show").click(function() { 
    $("$car2").show(); 
}); 

Así que ahora quiere comprobar si el div #car2 todavía está oculto antes de su presentación formulario:

if($('#car2').is(':hidden')) { 
    alert('car 2 is hidden'); 
} 

Ahora aquí es el problema. Aunque el div #car2 ya se muestra, todavía recibí un mensaje de alerta, lo que significa que jQuery asume que el div #car2 aún está oculto.

Mi versión jQuery es 1.7.

Gracias.

EDIT:

Como dijo Jasper, mi código es correcto y se puede ejecutar a través de este demo.

Lo que sospecho que hay algún conflicto con jquery form to wizard plugin que estoy utilizando con mi formulario. Alguien tiene alguna idea para resolver esto?

+1

http://jsfiddle.net/YjP4K/2/ Su código funciona cuando simplificado así que tal vez usted tiene un error en otro lugar? – Jasper

+0

Véase también [Comprobación de si un elemento está oculto \ [por jquery \]] (https://stackoverflow.com/questions/178325/checking-if-an-element-is-hidden) –

Respuesta

61

se puede comprobar la propiedad CSS display:

if ($('#car').css('display') == 'none') { 
    alert('Car 2 is hidden'); 
} 

Aquí es una demostración: http://jsfiddle.net/YjP4K/

+0

aunque otra respuesta es correcta, pero de alguna manera solo puedo usar este método en mi forma, así que elegiré esto como una respuesta. Gracias. – cyberfly

+1

'$ ('# car'). Is (: hidden)' debería funcionar. Esta también es una solución más limpia que la actual. Consulte más en https://api.jquery.com/hidden-selector/ – akshay

+1

@akshay, sí, eso tiene más sentido semántico. Creo que hay casos extremos en los que hacer tu propio cheque tiene sentido porque hay condiciones alrededor de los elementos que se atornillan con los selectores ': hidden' y': visible'. – Jasper

4

trata de leer para el: propiedad visible en su lugar.

if($('#car2').not(':visible')) 
{ 
    alert('car 2 is hidden');  
} 
28

Probar:

if(!$('#car2').is(':visible')) 
{ 
    alert('car 2 is hidden');  
} 
+1

Debería marcarse como respuesta – Thamaraiselvam

2

¿Se dio cuenta de su error tipográfico, $car2 en lugar de #car2?

De todos modos, :hidden parece estar funcionando como se esperaba, pruébalo here.

8

Try

if($('#car2').is(':hidden')) 
{ 
    alert('car 2 is hidden');  
} 
1

Se puede utilizar,

if (!$("#car-2").is(':visible')) 
{ 
     alert('car 2 is hidden'); 
} 
Cuestiones relacionadas