如何打印隐藏文章(Css/JQuery)

Question

我想打印一篇因为Javascript/Jquery而被隐藏的文章。这只是真实代码的一小段。在真正的代码中，有一个按钮可以显示"class2"。单击时，类1将隐藏，类2将显示。当用户想要打印时，无论类是否隐藏，他都应该能够打印所有内容。

<article class="x class1">
        <section>
            <p>1</p>
        </section>
        <section>
            <p>1</p>
        </section>
    </article>
    <article class="x class2">
        <section>
            <p>2</p>
        </section>
        <section>
            <p>2</p>
        </section>
    </article>
    <script type="text/javascript">
            $(document).ready(function () {
                $(".x").hide()
                $(".class1).show()
            });
    </script>

Answer 1

查看小提琴：http://jsfiddle.net/vfub0d50/1/

<article class="x class1">
        <section>
            <p>1</p>
        </section>
        <section>
            <p>1</p>
        </section>
    </article>
    <article class="x class2">
        <section>
            <p>2</p>
        </section>
        <section>
            <p>2</p>
        </section>
    </article>

CSS

.hide{
    display: none;
}
    @media print {
        .class2 {
        display:block;    
        }
    }

jQuery

$(document).ready(function () {
    $(".class2").addClass('hide');
});

这是有效的，因为我不使用.hide()和。show()，它添加了内联css，从而覆盖了所有其他可能的样式。这会添加一个类来隐藏div。此方法未添加任何内联css。