Javascript 使用当前css打印html页面_Javascript_Html_Css_Printing

Javascript 使用当前css打印html页面

javascript html css printing

Javascript 使用当前css打印html页面,javascript,html,css,printing,Javascript,Html,Css,Printing,我想用当前的css在html页面中打印一些已识别的div 当我尝试通过“ctrl+p”打印页面时，css被包括在内。但如果我通过按钮执行此操作，打印屏幕将不包含css 有什么建议吗？谢谢我的代码样本 <head> <link rel="stylesheet" href="bootstrap.css" type="text/css" media="screen"> <link rel="stylesheet" href="bootst

我想用当前的css在html页面中打印一些已识别的div

当我尝试通过“ctrl+p”打印页面时，css被包括在内。但如果我通过按钮执行此操作，打印屏幕将不包含css

有什么建议吗？谢谢

我的代码样本

<head>
        <link rel="stylesheet" href="bootstrap.css" type="text/css" media="screen">
        <link rel="stylesheet" href="bootstrap.css" type="text/css" media="print">

        <link rel="stylesheet" href="cssFile.css" type="text/css" media="screen">
        <link rel="stylesheet" href="cssFile.css" type="text/css" media="print">
</head>

我使用相同的css文件链接，包括屏幕媒体属性和打印媒体属性。这个方法合适吗？我应该在js函数中为打印编写一个新的css吗

我还尝试在js函数中添加css文件

<script>
    $( document ).ready(function() {
        $("#button").click(function(){
            var divId = "div";

            window.frames["print_frame"].document.head.innerHTML='<link rel="stylesheet" href="css/bootstrap.css" type="text/css" media="print"> <link rel="stylesheet" href="css/cssFile.css" type="text/css" media="print">';
            window.frames["print_frame_ssd"].document.body.innerHTML=document.getElementById(divId).innerHTML;
            window.frames["print_frame"].window.focus();
            window.frames["print_frame"].window.print();
        }); 
    });
</script>


$（文档）.ready（函数（）{
$（“#按钮”）。单击（函数（）{
var divId=“div”；
window.frames[“print_frame”].document.head.innerHTML=''；
window.frames[“print\u frame\u ssd”].document.body.innerHTML=document.getElementById（divId）.innerHTML；
window.frames[“print_frame”].window.focus（）；
window.frames[“print_frame”].window.print（）；
}); 
});


内容。。

要确保样式表正常，您可以查看此帖子

你可以试试这个功能

var prtContent = document.getElementById("your div id");
var WinPrint = window.open('', '', 'left=0,top=0,width=800,height=900,toolbar=0,scrollbars=0,status=0');
WinPrint.document.write(prtContent.innerHTML);
WinPrint.document.close();
WinPrint.focus();
WinPrint.print();
WinPrint.close();

试试看，让我知道它对你有用：）

谢谢你的回答。不幸的是，打印屏幕中仍然没有css。

var prtContent = document.getElementById("your div id");
var WinPrint = window.open('', '', 'left=0,top=0,width=800,height=900,toolbar=0,scrollbars=0,status=0');
WinPrint.document.write(prtContent.innerHTML);
WinPrint.document.close();
WinPrint.focus();
WinPrint.print();
WinPrint.close();