JQuery修改print.css文件的CSS类不生效

Question

我有一个带有两个不同打印按钮和两种div标签的页面：

<button onclick="window.print()">Print Full</button>
<button onclick="PrintPartial()">Print Partial</button>

<div class="not-partial">
    Div Content Here should print for "Print Full" but not for "Print Partial" 
</div>

<div class="no-print">
    This content shouldn't print on either
<div>

我的print.css文件中有以下内容

.no-print { display: none; }

下面是我的PrintPartial()函数

function PrintPartial() {
    var notPartial = $(".not-partial");
    notPartial.addClass("no-print");
    window.print();
    notPartial.removeClass("no-print");
}

"Print Full“按钮工作正常，并根据我的print.css文件进行打印。使用"no- print“类正确编码的div不能打印。

然而，"Print Partial“按钮打印输出与”print full“按钮完全相同。

当我运行调试器并进入PrintPartial()函数时，我可以检查元素，"no-print“类被添加到正确的元素中。它调用window.print()打开打印对话框，并从存储在notPartial变量中的元素中删除"no- print“类。

我唯一的想法是JQuery select和addClass是异步运行的，它在类更改之前调用打印？如果是这样，我如何确保在addClass完成之前不会调用window.print。

我试着在没有removeClass步骤的情况下运行它，得到了同样的结果，所以我知道这不是我的问题，或者至少不是我唯一的问题。

有没有人能告诉我我哪里做错了，怎么改正？

谢谢，斯科特

更新:正如Pabs123指出的那样，上面的代码运行良好。我遇到了一个问题，一个不同的css (不包括在本文中)导致display属性被改回。

谢谢

Answer 1

抱歉，我在这里发布的代码可以正常工作。正如Pabs123在他/她的评论中所建议的那样，我有其他冲突的css没有包含在帖子中，那就是将显示样式从display: none改回。因此，正如帖子所说，这并不是一个好问题。抱歉的。

谢谢你的帮助。