javascript - JavaScript を使用して外部フォントが読み込まれたかどうかを検出する

Question

30 個の外部フォントを読み込んでいます。フォントが読み込まれたかどうかを検出して、アプリケーションの使用準備が整ったことをユーザーに知らせる必要があります。どうやってやるの？

CSS、画像、JS を検出する方法は知っていますが、フォントは認識していません。私は見ましたが、それに関するチュートリアルは見つかりませんでした。注: 私は Google フォントを使用していないため、Google フォントの JavaScript プラグインを使用できません。

30 個のフォントはすべて、 FontFaceという名前の jQuery プラグインを使用して配列から読み込まれます。これは、フォント フォルダーのパスを追加して名前を付けるだけで少し変更されています。

$.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'
    })
});