Javascript插入的元素在Firefox中出现/更新&Chrome，但不是ie8

Javascript inserted elements appear/update in Firefox & Chrome, but not Internet Explorer 8

本文关键字：Chrome 更新 ie8 元素 插入 Firefox Javascript      更新时间：2023-09-26

如果你能帮我解释一下，我真的很感激。

我正在构建一个面向对象的拖放JavaScript界面，但是我甚至无法在IE8的屏幕上进行基本的修改。它在FF和Chrome中完美地工作。检查:

http://gfe.ca/JAShowcaseBuilder/test2.html

您可能会注意到这是一个真正的面向对象设计，这意味着多个文件串联工作，所以我不能在这里只发布一小段代码。我认为 JAShowcaseBuilderDraggableComponentClass.js文件的第164行是一个很好的起点。I 可以验证代码是否执行并且不会过早终止。为了兼容IE8，我必须做什么修改?IE8 根本不会产生任何错误，即使勾选了"Tools -> Internet Options -> Advanced -> Browsing -> Display a notification about every script error"。该死的IE8调试器甚至不会在脚本运行时显示DOM的动态变化(如Chrome和Firefox)。

更新:不幸的是，我已经决定，我不能没有元素的半透明。我已经确定静态页面元素可以通过设置以下两个样式属性来使其半透明:

-ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50)
filter: alpha(opacity=50)

这已经成功地在HTML中定义了一个新的绿色小div。不幸的是，下面的代码不能在javascript中设置时做同样的事情:

this.dragHelperDivElementReference.css("filter", "alpha(opacity="+String(this.dragHelperDivOpacityNumber)+")");
this.dragHelperDivElementReference.css("-ms-filter", "progid:DXImageTransform.Microsoft.Alpha(opacity="+String(this.dragHelperDivOpacityNumber)+")");

对于初学者来说，在绿框的情况下(它可以工作)，IE8调试器中呈现的DOM模型根本不显示"-ms-filter"属性。红框的DOM模型(不起作用)错误地显示属性为"msfilter"(没有破折号)。什么好主意吗?

更新# 2:想通了。透明度不能应用于父Div元素，它本身没有宽度或高度。它必须应用于子元素。不用说，总的来说我讨厌IE8和微软。特别感谢scessor (http://stackoverflow.com/users/843985/scessor)为我指明了正确的方向。

试着在

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

问题是css opacity filter。IE8需要
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
而不是filter: alpha(opacity=50); .

=== UPDATE ===

可能以下代码在所有IE中都有效:在文件JAShowcaseBuilderClass.js中将第101 - 110行替换为:

var sVersion = $.browser.version.substr(0, 2);
if (sVersion == '5.' || sVersion == '6.' || sVersion == '7.') {
    this.dragHelperDivElementReference.css(
        "filter",
        "alpha(opacity=" + String(this.dragHelperDivOpacityNumber) + ")"
    );
} else if (sVersion == '8.') {
    this.dragHelperDivElementReference.css(
        "filter",
        "progid:DXImageTransform.Microsoft.Alpha(Opacity=" + String(this.dragHelperDivOpacityNumber) + ")"
    );
} else {
    this.dragHelperDivElementReference.css(
        "opacity", 
        String(this.dragHelperDivOpacityNumber / 100)
    );
}

相关文章：