2

所以我有一个带有文本的 div，当您在我制作的选择列表中选择不同的字体时，它会发生变化。目前列表非常有限，因为我必须自己添加字体。

有什么方法可以将用户计算机上安装的所有字体添加到列表中，而不必自己添加它们？

HTML

<div id="generate">
       Change the text! 
</div>

<select id="box" onchange="font();">
    <option id="PIC" value="Kies een font">Kies een font.</option>
    <option id="TNR" value="TimesNewRoman">Times New Roman</option>
    <option id="GRG" value="Georgia">Georgia</option>
    <option id="PLT" value="PalatinoLinotype">Palatino Linotype</option>
    <option id="ARL" value="Arial">Arial</option>
    <option id="CMS" value="ComicSans">Comic Sans</option>
    <option id="IMP" value="Impact">Impact</option>
    <option id="TMS" value="TrebuchetMS">Trebuchet MS</option>
    <option id="TSB" value="TheSansBlack">The Sans Black Plain</option>
</select><br />

Javascript

 function font() {
        var sf = document.getElementById('box').value;
        var generate = document.getElementById('generate');

        switch(sf){
            case 'TimesNewRoman': 
                generate.style.fontFamily = ('Times New Roman')
                break;
            case 'Georgia': 
                generate.style.fontFamily = ('Georgia')
                break;
            case 'PalatinoLinotype': 
                generate.style.fontFamily = ('Palatino Linotype')
                break;
            case 'Arial': 
                generate.style.fontFamily = ('Arial')
                break;
            case 'ComicSans': 
                generate.style.fontFamily = ('Comic Sans MS')
                break;
            case 'Impact': 
                generate.style.fontFamily = ('Impact')
                break;
            case 'TrebuchetMS': 
                generate.style.fontFamily = ('Trebuchet MS')
                break;
            default: generate.style.fontFamily = ('')
            }
        }
4

1 回答 1

0

您可以检查特定字体的可用性http://www.lalit.org/lab/javascript-css-font-detect/

您可以做的一件事是创建自己的列表并比较它的可用性，如上面链接中所述，并仅显示客户端系统上可用的字体。

于 2013-09-03T10:34:24.863 回答