jquery - 如何显示隐藏的 div答案

【问题标题】：jquery - how to show a hidden divjquery - 如何显示隐藏的 div
【发布时间】：2012-05-23 14:00:23
【问题描述】：

我的页面中嵌入了一个谷歌地图，其可见性设置为隐藏。使用一个按钮，我想在页面上显示地图。应该使用 jquery 来完成。

我的代码 - （不工作）

<div id="map" style="height: 350px; border: 1px solid #979797;visibility="hidden";></div>

谁能帮我处理相关的jquery代码？

【问题讨论】：

你试过看jQuery site吗？
您的样式错字语法似乎有误。应该是<div id="map" style="height: 350px; border: 1px solid #979797;visibility:hidden"></div>

标签： jquery html

【解决方案1】：

试试

$('#map').css('visibility','visible');

其实如果style有display:none，可以使用jquery函数

$('#map').show();

【讨论】：

我有一个按钮这是我的 jquery： $(document).ready(function(){ $( '#show').click(function(){ $('#map').show(); }); });它不起作用，你能帮我吗
@devilived 如果你的风格使用“可见性”，它必须是$('#map').css('visibility','visible');。因为$('#map').show(); 适用于display:none 的风格
@devilived 你的 jquery 函数必须是这样才能看到它是如何工作的。 $(document).ready(function(){ $('#show').click(function(){ $('#map').css('visibility','visible');return false; }); });
每次我尝试这样做时，我都必须查看这个答案......来回走动。为“为什么”+1，因为这确实有助于了解在哪种情况下使用哪个。

【解决方案2】：

您的 style="" 标签也不正确。你应该有这个：可见性：隐藏；

试试这个：

<div id="map" style="height: 350px; border: 1px solid #979797; display: none";></div>

$("#map").show();

【讨论】：

【解决方案3】：

这是一个 jsfiddle：http://jsfiddle.net/lucuma/GhMbU/

$('div#map').css('visibility', 'visible')

【讨论】：

【解决方案4】：

但如果你愿意，visibility:hidden 比 display:none 要好使用 jQuery 来隐藏它。因为jQuery的.show()函数覆盖了一些页面元素比如锚标签，防止了点击事件。

【讨论】：