jQuery&CSS - 删除/添加display:none

Question

我有这个班的div:

.news{
  width:710px; 
  float:left;
  border-bottom:1px #000000 solid;
  font-weight:bold;
  display:none;
}

我想用一些jQuery方法删除那个显示:none; (所以div会显示)然后再添加它(所以div会阴影).

我该怎么做？干杯

Answer 1

隐藏 div

$('.news').hide();

要么

$('.news').css('display','none');

并显示div:

$('.news').show();

要么

$('.news').css('display','block');

Answer 2

jQuery为您提供:

$(".news").hide();
$(".news").show();

然后,您可以轻松地显示和隐藏元素.

Answer 3

那么,让我给你一些示例代码:

<div class="news">
Blah, blah, blah. I'm hidden.
</div>

<a class="trigger">Hide/Show News</a>

链接将是单击时显示div的触发器.所以你的Javascript将是:

$('.trigger').click(function() {
   $('.news').toggle();
});

你最好让jQuery处理隐藏和显示元素的样式.

编辑:我看到上面的人推荐使用.show和.hide为此..toggle只允许一种效果,你可以做到这两件事.这太酷了.

Answer 4

在JavaScript中:

getElementById("id").style.display = null;

在jQuery中:

$("#id").css("display","");

Answer 5

使用切换显示和隐藏.

$('#mydiv').toggle()

查看http://jsfiddle.net/jNqTa/上的工作示例

Answer 6

我建议添加一个类来显示/隐藏元素:

.hide { display:none; }

然后使用jquery的.toggleClass()来显示/隐藏元素:

$(".news").toggleClass("hide");

Answer 7

通过jQuery的css-api删除内联"display:none"的唯一方法是使用空字符串重置它(null不工作btw !!).

根据jQuery文档,这是"删除"曾经设置的内联样式属性的一般方法.

$("#mydiv").css("display","");

要么

$("#mydiv").css({display:""});

应该正确地做到这一点.

恕我直言,jQuery中缺少一种可以称为"取消隐藏"或"显示"的方法,而不仅仅是设置另一个内联样式属性,如上所述正确设置显示值.或者也许hide()应该存储初始内联值并show()应该恢复...

Answer 8

jQuery的.show()和.hide()函数可能是你最好的选择.

Answer 9

你没有给我们太多的信息,但一般来说这可能是一个解决方案:

$("div.news").css("display", "block");

Answer 10

由于某种原因，切换对我不起作用，并且uncaught type error toggle is not a function在检查浏览器中的元素时收到错误。所以我使用了以下代码，它开始为我工作。

$(".trigger").click(function () {
    $('.news').attr('style', 'display:none');
})

使用jquery脚本文件jquery-2.1.3.min.js。