检测是否使用JavaScript加载了外部字体

Question

我正在加载30个外部字体，我需要检测字体是否已加载，以便让用户知道该应用程序已准备就绪。我怎么能这样做？

我知道如何检测CSS，图像和JS而不是字体。我看了，但我还没有找到任何教程。请注意：我没有使用Google字体，所以我无法使用他们的javascript插件。

使用我发现的名为FontFace的jQuery插件从阵列加载所有30种字体，我通过添加字体文件夹的路径对其进行了一些修改，以便我只给它命名。

$.each(fonts, function (e, w) { //loopin thru the font names
    $('ul#fonts').append('<li data-size="' + parseInt(w.string) + '" data-font="' + w.name + '">' + w.name + '</li>')
    $('li[data-font="' + w.name + '"]').fontface({
        fontName: w.name, //the font name
        fileName: w.font, //and path
        fontSize: parseInt(w.string) + "px" //the font size
    }).fontApply({ //apply the font to this specific element
        fontFamily: w.name,
        fontSize: parseInt(w.string) + 'px'
    })
});