在jQuery click（）事件上附加用于打印的样式表链接

我在head部分有一个具有media='screen'属性的css链接，然后我想要动态链接另一个具有media='print'属性的css文件。

我这样做是为了解决方案。

 $("div#alert").click(function(){ $('head') .append(""); window.print(); }); 

但是..当我运行该代码时，输​​出只是基于media='screen' screen’css打印。

然后我再次尝试相同的代码，我点击了div元素，当出现打印对话框时，我点击了取消按钮，然后我再次点击了div元素..然后点击了ok按钮这次.. media='print'正在工作……那么我该如何处理window.print() ？

Answer 1

也许你太早调用window.print（）（甚至在下载打印样式表之前） – 试试这个：

 $("div#alert").click(function(){ $('head') .append(""); setTimeout(function() { window.print(); }, 1000); }); 

更优雅的解决方案是异步加载样式表，将其插入头部，然后在AJAX请求的回调中调用print（）函数。

Answer 2

您可以通过以下方式使用$.get和success callback ：

 $("div#alert").click(function(){ $.get('css/alert.css', function (response) { $('head') .append("") .html(response); }).success(function () { window.print(); }); }); 

Answer 3

看起来您的javascript函数正在运行，并且不允许浏览器更新CSS。

观看此video ，了解事件循环如何在Javasript中运行。 这也意味着如果您的周期缓慢运行并阻止浏览器，您可以在超时中拆分它们。

我的建议是做一些像Alex说的那样，把.print放在超时。