jquery - 为什么 jquery 的 onbeforeprint 事件有问题？

Question

我有以下功能。

$(function() {
    $(".sectionHeader:gt(0)").click(function() {
        $(this).next(".fieldset").slideToggle("fast");
    });
    $("img[alt='minimize']").click(function(e) {
        $(this).closest("table").next(".fieldset").slideUp("fast");
        e.stopPropagation();
        return false;
    });
    $("img[alt='maximize']").click(function(e) {
        $(this).closest("table").next(".fieldset").slideDown("fast");
        e.stopPropagation();
        return false;
    });
});

<script type="text/javascript">
     window.onbeforeprint = expandAll;

     function expandAll(){
       $(".fieldset:gt(0)").slideDown("fast");
      }
</script>

对于这个html

    <table class="sectionHeader" ><tr ><td>Heading 1</td></tr></table>
     <div style="display:none;" class="fieldset">Content 1</div>

 <table class="sectionHeader" ><tr ><td>Heading 2</td></tr></table>
     <div style="display:none;" class="fieldset">Content 2</div>

我在页面上有几个 div class="fieldset"，但是当我进行打印预览或打印时，我可以在打开打印预览或打印之前看到所有 div 向下滑动，但在实际的打印预览或打印输出中，它们是全部崩溃。

如果有人能提供解决方案，我将不胜感激。

有人知道这是为什么或者如何解决它吗？

谢谢。

PS:使用 a 也不起作用(我假设是因为 jquery 使用切换)并且它不是我正在寻找的问题。

Answer 1

更简单的方法是在 CSS 中，您可以使用不同的打印样式和屏幕样式，如下所示:

@media print {
  .fieldset { display: block; }
}

@media screen {
  .fieldset { display: none; }
}

.fieldset 类将在打印时显示，但默认情况下不会在浏览器中显示。请务必删除页面中 .fieldset div 上的内联 diplay: none 样式，因为它们会覆盖 CSS 文件中的其中一个样式。