How to hide a div with jQuery?
When I want to hide a HTML <div>
, I use the following JavaScript code:
var div = document.getElementById('myDiv');
div.style.visibility = "hidden";
div.style.display =开发者_高级运维 "none";
What is the equivalent of that code in jQuery?
$('#myDiv').hide();
or
$('#myDiv').slideUp();
or
$('#myDiv').fadeOut();
$("#myDiv").hide();
will set the css display to none. if you need to set visibility to hidden as well, could do this via
$("#myDiv").css("visibility", "hidden");
or combine both in a chain
$("#myDiv").hide().css("visibility", "hidden");
or write everything with one css() function
$("#myDiv").css({
display: "none",
visibility: "hidden"
});
Easy:
$('#myDiv').hide();
http://api.jquery.com/hide/
If you want the element to keep its space then you need to use,
$('#myDiv').css('visibility','hidden')
If you dont want the element to retain its space, then you can use,
$('#myDiv').css('display','none')
or simply,
$('#myDiv').hide();
$("myDiv").hide();
and $("myDiv").show();
does not work in Internet Explorer that well.
The way I got around this was to get the html content of myDiv
using .html()
.
I then wrote it to a newly created DIV. I then appended the DIV to the body and appended the content of the variable Content
to the HiddenField
then read that contents from the newly created div when I wanted to show the DIV.
After I used the .remove()
method to get rid of the DIV that was temporarily holding my DIVs html.
var Content = $('myDiv').html();
$('myDiv').empty();
var hiddenField = $("<input type='hidden' id='myDiv2'>");
$('body').append(hiddenField);
HiddenField.val(Content);
and then when I wanted to SHOW the content again.
var Content = $('myDiv');
Content.html($('#myDiv2').val());
$('#myDiv2').remove();
This was more reliable that the .hide()
& .show()
methods.
$('#myDiv').hide()
will hide the div...
$('#myDiv').hide();
hide function is used to edit content and show function is used to show again.
For more please click on this link.
精彩评论