3

スタイルシートの読み込みに失敗したときにいくつかのフォールバックを配置するのに役立つ、さまざまなソースからのスクリプトをまとめました (特に、Pictos サーバーは常に信頼できるとは限りません)。

これはうまく機能しますが、Firefox では何らかの理由で失敗します。if ステートメント内で何も処理しません。私は JSHint を介して実行しようとしましたが、深刻なことは何も起こりません。

何か案は?

$(document).ready(function(){
    $.each(document.styleSheets, function(i,sheet){
      if(sheet.href==='http://get.pictos.cc/fonts/357/9') {
        var rules = sheet.rules ? sheet.rules : sheet.cssRules; // Assign the stylesheet rules to a variable for testing

        $('body').addClass('pictos-working');
        $('.pictos-fallback').hide(); // Hide fallbacks

        // If the stylesheet fails to load...
        if (rules.length === 0) {
            $('.pictos').hide(); // Hide Pictos tags so we don't get random letters
            $('body').removeClass('pictos-working'); // Remove 'working' class
            $('.pictos-fallback').show(); // Show fallbacks
        }
     }
    });
});​
4

2 に答える 2

5

スタイル シートの検出方法は信頼できません。同じオリジン ポリシーcssRulesにより、スタイル シートがnull別のドメインから生成された場合です。

オブジェクトを通じて CSS ルールの存在を検出する代わりにcssRules、スタイル シートのルールが適用されているかどうかを確認します。

if ($('selector').css('property') === 'expectedvalue') {
    // Loaded
} else {
    // Not loaded.
}
于 2012-07-01T14:40:58.537 に答える
0

役立つかもしれない改善のためのいくつかの提案:

なぜネストされたif? シナリオが 2 つしかないため、if then else を使用します。ファイルが読み込まれないときに cssRules がゼロであることを確認しますか? ロードされるヘッダーまたはメタデータがある可能性があります。このプロパティはどこで見つかりましたか?

私が見つけたもの:http://www.quirksmode.org/dom/w3c_css.html

于 2012-07-01T14:45:18.643 に答える