是否可以打印jQuery&x27隐藏的DIV；s"；“幻灯片”；功能

我有一个简单的“手风琴”类型的页面，包含H3标题和DIV内容框的列表（每个H3后面都有一个DIV）。在这个页面上，我从隐藏所有div开始。当单击H3时，jQuery函数会显示正下方（后面）的DIV，而所有其他DIV都会使用该函数隐藏

“slideUp”函数将以下内联样式插入到指定的div中：

style="display: none;"

我想知道是否有什么方法可以让我在用户打印页面时显示所有扩展的div（就像用户禁用JavaScript时一样）

我认为这是不可能的，因为内联样式总是优先于任何其他样式声明

还有别的解决办法吗

解决方案

非常好，可以在我测试过的浏览器（FF2、IE7和IE6）中使用。我不知道有任何方法可以覆盖内联样式，我很确定这是我以前查过的东西，所以很高兴能找到它。我也看到了关于这方面的问题。我希望搜索在这里导航不那么困难：-）

这很好，但是“slideUp”函数添加了style=“display:none；”位

工作很好，但在工作的时候太过分了！重要的申报工作。

是

加载时，向所有相关div添加一个类（例如“hideme”），如下所示：

$('div#accordion> div').addClass('hideme');

注意：这意味着禁用JavaScript时，手风琴性能会下降

通过这种方式，您可以让常规样式表指定“hideme”类，如下所示：

.hideme { display: none; }

div.hideme { display: block; }

<script type="text/javascript">
 //<![CDATA[
    $(function() {
        $('#accordion> div').addClass('hideme');

        $('#accordion> h3').click(function() {
          $(this).next('div:hidden').slideDown('fast').siblings('div:visible').slideUp('fast', function(){ $('#accordion> div:hidden').addClass('hideme').removeAttr('style'); });

      });
    });
 //]]>
</script>

打印样式表可以指定如下“hideme”类：

.hideme { display: none; }

div.hideme { display: block; }

<script type="text/javascript">
 //<![CDATA[
    $(function() {
        $('#accordion> div').addClass('hideme');

        $('#accordion> h3').click(function() {
          $(this).next('div:hidden').slideDown('fast').siblings('div:visible').slideUp('fast', function(){ $('#accordion> div:hidden').addClass('hideme').removeAttr('style'); });

      });
    });
 //]]>
</script>

接下来，在添加到每个H3的“单击”函数中，向上滑动DIV后，添加“hideme”类，然后从向上滑动的每个DIV中删除“style”属性

这个jQuery的整体外观如下所示：

.hideme { display: none; }

div.hideme { display: block; }

<script type="text/javascript">
 //<![CDATA[
    $(function() {
        $('#accordion> div').addClass('hideme');

        $('#accordion> h3').click(function() {
          $(this).next('div:hidden').slideDown('fast').siblings('div:visible').slideUp('fast', function(){ $('#accordion> div:hidden').addClass('hideme').removeAttr('style'); });

      });
    });
 //]]>
</script>

//

---

请注意，需要在slideUp函数中包含函数回调，以便在DIV向上滑动并且jQuery添加了“style=display:none；”之后发生样式和类更改。

您可以使用！CSS中的重要子句。这将覆盖内联样式

因此，如果您设置了打印媒体样式表，您可以执行以下操作

div.accordian { display:block !important; }

---

我个人会用另一种方式做这件事。与其让JQuery添加内联样式，不如让它添加一个类

<div class="closed">...</div>

---

但是在print.css中，您不会这样做（或者您会忽略显示：none）。这样，当涉及到打印所有div时，它们将被扩展，但在屏幕上，它们将被关闭。

{display:block！important；}在FF中工作，但我在某处读到它不适用于ie6。是否没有用于打印的javascript事件？我记得我曾经广泛地寻找过一个，但找不到一个，这似乎很疯狂，因为它不存在，js似乎知道浏览器中发生了什么事情，但出于某种原因对打印视而不见：(

布伦特 @

---

制作“显示为块”手风琴内部的所有元素将覆盖内部的所有div

---

#accordion>*{display:block！important；}

嗯，这个解决方案不完全有效，因为“display:none；”并没有从仍在向上滑动的div中删除，直到下一张幻灯片。如果您要回答自己的问题，您至少可以先调试它：-）。是的，我现在已修复：-）我调试过，只是很差：-）。我只是想在这里作为参考。我认为Sugendran的答案更有用、更简洁。拥有特殊的类和javascript方法是很笨拙的。是的，我不知道！出于某些原因很重要-我想我假设它是由Browsers执行的，因为我想使用幻灯片动画，默认情况下添加“style=display:none”；否则，谢谢。哦，我不知道！重要提示：在所有浏览器上工作以覆盖内联样式。非常感谢！