带有预览的字体选择器选择框

Question

我有一个在线徽标制作工具，我希望用户可以选择从我收集的大约100种免费网络字体中选择一种字体。

执行此操作的最佳方法是在表单选择框中，其中每个字体在选择中显示为选项，请参阅示例：

不幸的是，似乎没有任何方法可以使用CSS实现这一点，所以我一直在寻找第三方插件。

我通过Bootstrap Form Helper找到了一个非常好的脚本，它可以显示a select box of the user's device fonts，还有一个显示a selection of Google Web Fonts as a select box的脚本，但这些脚本都不符合我的目的。 （字体不在用户设备上，或由Google托管）。

我想做同样的事情，但是我的服务器上有一个“.ttf”文件列表，例如：

[
  "Alakob"     : "http://www.example.com/fonts/Alakob.ttf",
  "Baron Neue" : "http://www.example.com/fonts/Baron-Neue.ttf",
  "Casper"     : "http://www.example.com/fonts/Casper.ttf",
  "Damion"     : "http://www.example.com/fonts/Damion-Regular.ttf",
  ...
]

是否有人知道是否可以修改这些脚本中的任何一个以显示我作为JSON或XML Feed提供的字体文件列表，而不是用户设备上的字体或Google字体？

非常感谢您的阅读！