IE不在div上显示背景颜色

时间:2015-02-25 15:42:37

标签: javascript jquery html css internet-explorer

问题似乎是IE(9-edge)只阻止了我正在设置的javascript的一部分。虽然我可以删除安全设置以显示所需的效果,但我不能要求用户也这样做。我确定这里缺少一些东西,因为其余的代码都能正确显示。

$.each(data.results.audio, function(key, val) {
   var replace = val.mp3Url.replace('&', '&');

   if (val.imgUrl) {
      status = "style='background:";
      switch (val.roadCondition) {
         case "1":
            status += "#4CAF50'"; // green
            break;
         case "2":
            status += "#FFEB3B'"; // yellow
            break;
         case "3":
            status += "#D32F2F'"; // red
            break
         case "4":
            status += "black'"; // black
            break;
         default:
            status += "white'"; // white
      }
   }

   var items2 = "<div class='bt_icon z-depth-5 hvr-round-corners'" + status + "><p class='shine waves-effect waves-green hvr-round-corners'><img id='" + key + "' class='majors ' src='" + val.imgUrl + "' alt='" + val.name + "' title='" + val.name + "' data-audio='" + replace + "' /></p></div>";
   $("#button_icons").append(items2);
   if (first && !isDone) {
      isDone = true;
      var audio = document.querySelector("audio");
      audio.src = replace;
      audio.load();
   }

   items.push(items2);

});

注意:背景颜色具有相同的效果。

其他代码工作正常,除了&#34; status&#34;变量设定。 Chrome,Firefox和Safari均可正常显示。但在IE上,似乎上面的状态&#34;代码永远不会被注入它没有出现在dev工具的dom中。获取所有代码的唯一方法是将安全设置丢弃到medium并重新加载页面。任何解释/修复?

1 个答案:

答案 0 :(得分:0)

原来答案是在IE兼容性的元标记中。当IE运行非安全的Intranet内容时,它默认为兼容模式。这就是我所拥有的:

<meta http-equiv="X-UA-Compatible" content="IE=EDGE; IE=9; IE=8"/>

这就是我改为:

<meta http-equiv="X-UA-Compatible" content="IE=EDGE"/>

有一个很好的解释为什么这会导致我的问题: IE Compatibility Mode: 'X-UA-Compatible' tag 'Edge'