Question

我有一个简单的代码块来隐藏/显示两个div。它工作得很好，我唯一的问题是我需要将显示值返回到＃MSOZoneCell_WebPartWPQ2回到表。我最初在css中将其设置为none。最后一行似乎没有生效。

这是代码：

$(function() {
$('#swap').click(function() {

    $('#MSOZoneCell_WebPartWPQ2').toggle();
    $('#example_wrapper').toggle();
    $('#MSOZoneCell_WebPartWPQ').css('display') == 'table';
});
});

Answer 1

您正在使用==运营商

试试这个：

$(document).ready(function(){
    $('#swap').click(function() {
        $('#MSOZoneCell_WebPartWPQ2').toggle();
        $('#example_wrapper').toggle();
        $('#MSOZoneCell_WebPartWPQ').attr('style','display:table;');
    });
});

Answer 2

你确定你需要＆＃34; ==＆＃34;设定值？或者一个＆＃34; =＆＃34;

Answer 3

首先==是一个等式检查。您应该使用=来设置值。

其次，css()方法setter接受两个参数。要设置的规则和值本身。试试这个：

$('#MSOZoneCell_WebPartWPQ').css('display', 'table');

Answer 4

你应该使用.css( propertyName, value )

为匹配元素集设置一个或多个CSS属性。

所以你的最后一行应该是

$('#MSOZoneCell_WebPartWPQ').css('display', 'table');

当您致电 .css（propertyName）

时

$('#MSOZoneCell_WebPartWPQ').css('display);

您获取所述属性的值而未设置

获取集合中第一个元素的计算样式属性匹配的元素。

更新1：

请注意，Jquery的.show（）,. hide（）和.toggle（）仅适用于具有块显示属性的元素。

所以避免来回更改显示属性的一种方法是将所需元素包装在div（容器）和.toggle（）中。

I have created a JSFiddle，我在一个容器div中用一个名为＆＃34; toggle＆＃34;并将其中一个的初始显示值设置为＆＃34; none＆＃34;使用样式属性。

<div class="toggle" style="display:none">

现在我使用此

在它们之间切换

$('.toggle').toggle();

更新2：

你也可以使用 .toggleClass（） here's another JSFiddle

将此添加到您的CSS

#example_wrapper.hiddenDiv, #MSOZoneCell_WebPartWPQ2.hiddenDiv {
  display: none;
}

在您想要隐藏的div中添加一个类

<div id="MSOZoneCell_WebPartWPQ2" class="hiddenDiv">

使用此

切换课程

$(function() {
$('#swap').click(function() {
    $('#MSOZoneCell_WebPartWPQ2').toggleClass("hiddenDiv");
    $('#example_wrapper').toggleClass("hiddenDiv");
});
});

在这个例子中，我使用了一个名为＆＃34; hiddenDiv＆＃34;的类，如果你改变它，请确保CSS，HTML和JS中的类名相同。

切换div以显示隐藏

4 个答案:

更新1：

更新2：