JS：window.open - 如何设置Open Sans字体？

问题描述：

我无法得到它的工作。我唯一需要的 - 将所有内容字体家族设置为'Open Sans'。以下是我现在所拥有的JS：window.open - 如何设置Open Sans字体？

 var popupWin = window.open('', '_blank', 'width="100%",height="100%"'); 
     popupWin.document.write('<html><head><link href=\'http://fonts.googleapis.com/css?family=Open+Sans\' rel=\'stylesheet\' type=\'text/css\'></head><body>' + content + '</body></html>'); 
     popupWin.document.body.setAttribute('style', 'font-family: \'Open Sans\' !important'); 
     popupWin.document.close(); 
     popupWin.print(); 
     popupWin.close(); 
    }

这块代码显示空白页面的，但是当我删除link属性的内容显示，但使用默认的家庭。有任何想法吗？

P.S.内容变量包含一个简单的HTML标记，我试图设置样式像

<div style="font-family='Open Sans'">

，但没有运气。

你从HTTPS选项卡中打开网页？如果是这样，浏览器将阻止您的请求“http：// ....”。尝试删除协议'href = \'// fonts.googleapis.com/css？family = Open + Sans \'' – DrColossos

是的，我正在使用HTTPs，但是如何删除协议，Open Sans不是一个标准字体，我必须上传它 –

评论告诉你如何。只需从'href'属性的开头删除'http：'（保留斜线）即可。 – Phylogenesis

答

将http更改为https。您可能还想在打印之前添加延迟。尝试以下方法：

document.querySelector('button').onclick = function() { 
 
    var content = document.querySelector('textarea').innerHTML; 
 

 
    var popupWin = window.open('', '_blank', 'width="100%",height="100%"'); 
 
    if (popupWin) { 
 
    console.log('Popup was blocked'); 
 
    return false; 
 
    } 
 
    popupWin.document.write('<html><head><link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet" type="text/css"></head><body>' + content + '</body></html>'); 
 
    popupWin.document.body.setAttribute('style', 'font-family: "Open Sans" !important'); 
 
    setTimeout(function() { 
 
    popupWin.document.close(); 
 
    popupWin.print(); 
 
    popupWin.close(); 
 
    }, 2000); 
 
};

<h1>Test</h1> 
 
<textarea>Put this on the popup page</textarea> 
 
<button>Print</button>

这很奇怪，但问题只是在延迟后才消失，你能解释一下为什么吗？ –

我认为打印功能并未等待资源加载。 – styfle

JS：window.open - 如何设置Open Sans字体？

相关推荐