Question

我想打印一篇因Javascript / Jquery而隐藏的文章。这只是真实代码的一小段。在真实的代码中有一个按钮，你可以显示“class2”。单击时，隐藏class1并显示class2。当用户想要打印时，他应该能够打印所有类，而不是隐藏类。

<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。

如何打印隐藏的文章（Css / JQuery）

1 个答案: