介質打印無法在Chrome應用樣式，但在Firefox的作​​品完美

Question

我有這個js函數：

function print(title, htmlPrint) { 
    var w = window.open('', '', 'width=600,height=750'); 
    w.document.title = title; 
    w.document.write('<link rel="stylesheet" type="text/css" href="print.css" />'); 
    w.document.write(htmlPrint); 
    w.document.close(); // needed for chrome and safari 
    w.print(); 
    w.close(); 
    return false; 
} 

，並在CSS我有這樣的事情：

@media print, screen{ 
..... 
} 

在Firefox作品如預期的那樣：顯示標題&內容，使用chrome顯示標題和空白頁面（打印時相同）。

我試過也與@media print{}或@media all{}仍然無法正常工作。

我試過還添加media="print"在<link... />，這樣做，它加載CSS，但是任何CSS並不適用於該頁面。

我試過也改變功能及使用w.document.head.innerHtml和w.document.body.innerHtml - 仍然一無所獲，具有相同的行爲.write()。

Answer 1

什麼工作對我來說：

首先我不得不CSS文件的完整路徑，並設置鏈接標籤的介質打印。

if (/chrome/i.test(navigator.userAgent)) { 
    w.document.write('<link rel="stylesheet" type="text/css" href="' + location.protocol + '//' + location.host + (new String(location.pathname.substring(0, location.pathname.lastIndexOf("/")))) + '/print.css" media="print" />'); 
}else{ 
    w.document.write('<link rel="stylesheet" type="text/css" href="print.css" />'); 
} 

然後，它仍然沒有正常工作，我剛剛發現的w.close()使問題鑲邊。

if (/chrome/i.test(navigator.userAgent) === false) { 
    w.close(); 
}