我正在尝试使用Internet Explorer中的onload事件为CDNS创建CSS后备,但是在使它工作时遇到了问题。 onerror版本适用于Chrome和Firefox。我正在尝试将变量linkSuccess设置为false,并在加载样式表时使用onload事件将linkSuccess更改为true。如果onload事件没有触发,则运行后备链接时linkSuccess应该保持为false。但是我很难让它工作。

您可以提供的任何帮助都将受到赞赏!谢谢!


    

<!-- CDNs for Bootstrap and Font-Awesome -->
<link id="bootstrapFallback" onError="stylesheetFallback(this.id)" onLoad="ieFallbackCheck(this.id)" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.1./css/bootstrap.min.css">
<link id="fontAwesomeFallback" onError="stylesheetFallback(this.id)" onLoad="ieFallbackCheck(this.id)" rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css">


fallback.js代码:

var cssFallbacks = {
  "bootstrapFallback" : "/bootstrap.min.css",
  "fontAwesomeFallback" : "/font-awesome.min.css"
};

var linkSuccess = false;

function stylesheetFallback(fallbackKey) {
  document.getElementById(fallbackKey).href = cssFallbacks[fallbackKey];
}

function ieFallbackCheck(fallbackKey) {
    var linkSuccess = true;
}

if (linkSuccess = false) {
    document.getElementById("bootstrapFallback").href = cssFallbacks[bootstrapFallback];
    console.log("Initiate Fallback");
}

最佳答案

您最好将conditional comments用于CSS后备:

<link href="original-styles.css" type="text/css" rel="stylesheet"/>
<!--[if lte IE 8]>
<link href="ie6-fix.css" type="text/css" rel="stylesheet"/>
<![endif]-->


注释中的链接仅由IE 8和以下版本解释。

关于javascript - 使用onload为Internet Explorer创建CSS后备,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/37664014/

10-12 06:42