2011-03-21 28 views
45

Cuando quiero ocultar una <div> HTML, uso el siguiente código JavaScript:¿Cómo ocultar un div con jQuery?

var div = document.getElementById('myDiv'); 
div.style.visibility = "hidden"; 
div.style.display = "none"; 

Cuál es el equivalente de ese código en jQuery?

Respuesta

92
$('#myDiv').hide(); 

o

$('#myDiv').slideUp(); 

o

$('#myDiv').fadeOut(); 
5

$('#myDiv').hide() se oculta el div ...

18
$("#myDiv").hide(); 

establecerá la pantalla css a ninguno. si es necesario configurar la visibilidad a escondidas, así, podría hacerlo a través de

$("#myDiv").css("visibility", "hidden"); 

o combinar ambos en una cadena

$("#myDiv").hide().css("visibility", "hidden"); 

o escribir todo con función de un solo css()

$("#myDiv").css({ 
    display: "none", 
    visibility: "hidden" 
}); 
7

$("myDiv").hide(); y $("myDiv").show(); no funciona bien en Internet Explorer.

La forma en que conseguí esto fue obtener el contenido html de myDiv usando .html().

Luego lo escribí en un DIV recién creado. A continuación, agregué el DIV al cuerpo y anexé el contenido de la variable Content al HiddenField y luego leí ese contenido del div recién creado cuando quería mostrar el DIV.

Después de que usé el método .remove() para deshacerme del DIV que contenía temporalmente mi DIVs html.

var Content = $('myDiv').html(); 
     $('myDiv').empty(); 
     var hiddenField = $("<input type='hidden' id='myDiv2'>"); 
     $('body').append(hiddenField); 
     HiddenField.val(Content); 

y luego, cuando QUISO volver a mostrar el contenido.

 var Content = $('myDiv'); 
     Content.html($('#myDiv2').val()); 
     $('#myDiv2').remove(); 

esto era más fiable que los métodos .hide() & .show().

10

Si desea que el elemento a tener su espacio, entonces es necesario utilizar,

$('#myDiv').css('visibility','hidden') 

si no quieres el elemento para conservar su espacio, entonces se puede utilizar,

$('#myDiv').css('display','none') 

o simplemente,

$('#myDiv').hide(); 
Cuestiones relacionadas