Question

我已编写此脚本以淡入/淡出错误容器。它在FF和Chrome中运行良好，但在IE8中根本不起作用。

你可以在这里玩小提琴：http://jsfiddle.net/mostafatalebi/8tw2x/

或查看以下代码：

这是Container CSS：

.error-box
{
    filter:inherit; 
    width: auto;
    display: inline;
    padding: 5px;
    border-radius: 5px;
    -webki-border-radius: 5px;
    -moz-border-radius: 5px;
    direction: rtl;
    text-align: right;
    background-color: #C00;
    color: white;
    font-size: 13px;
    width: 200px;
    float: left;
    margin-bottom: 5px;
    opacity:inherit;
    filter:inherit;
}

这是HTML DOM：

<label class="form-label">Email</label><br />
                <div class="form-field-holder">
                    <input id='email' type="text" name="email" class="form-input" />
                    <div class="error-box"><!-- jQuery --></div><br /> 
</div>

以下是处理该过程的jQuery代码：

        $(document).ready(function(e) {

            var email = $("#email");
            email.on('blur', function(){
                console.log(email_regexp.test(email.val()));
                if(!email_regexp.test(email.val()))
                {
                    $(this).siblings('.error-box').fadeIn(600).text("رایانامه شما اشتباه است");                                                         
                }   
                else
                {
                    $(this).siblings('.error-box').fadeOut(600);    
                }
            });                                                                                                                                                             
        });

Answer 1

关于兼容性和jQuery

jQuery 2.x仅适用于Internet Explorer 9及更高版本。如果您希望支持Internet Explorer 8中的淡入淡出元素（以及低至6），则需要使用jQuery 1.x，它仍然支持旧的IE过滤器属性。

我已经确认切换到jQuery 1.x可以解决问题。没有其他任何必要的东西，即使在过去看来可能需要额外的解决方法。

在控制台和旧版Internet Explorer上

要记住的另一件事是，console最初并不存在于IE8中。因此，任何调用console.log的尝试都会导致问题。如果您想使用它，请首先预先检查console的可用性。您可以使用&&执行此操作，但这是considered an abusage：

window.console && console.log( email_regexp.test( email.val() ) );

或者，您可以采用更详细的路线并使其成为一个合适的条件：

if ( window.console ) { console.log( email_regexp.test( email.val() ) ); }

如果您不想通过控制台检查丢弃代码，只需定义自己的代码：

if ( !window.console ) {
    // When debug is true, console.log alerts
    var debug = true;
    window.console = {
        log: function ( message ) {
            if ( debug ) alert( message );
        }
    };
}

进一步阅读：jQuery Browser Support

Answer 2

取自jQuery fadeIn fadeOut - IE8 does not fade

取自Omeriko： “显然有一种解决方法！

只需将绝对/相对定位元素设置为以下css属性：

opacity:inherit;
filter:inherit;

E.g：

<div>
<img id='myImg' src='http://mydomain.com' style='position:absolute;top:10px;left:5px;filter:inherit;opacity:inherit' />
</div>

玩得开心，

欧麦'

Answer 3

您需要为IE创建手动fadeIn fadeOut函数，以删除过滤器属性。然后它会完美地运作。

关于如何做的好教程：

http://www.epochdev.com/blog/tutorials/javascript_development/fixing_jquery_fade_in_and_out_functions_for_internet_explorer

Answer 4

在IE8中似乎没有很好地支持FadeIn和FadeOut。虽然它在IE的其他更高版本上可以正常工作。

jQuery fadeIn和fadeOut与IE8不兼容

4 个答案:

关于兼容性和jQuery

在控制台和旧版Internet Explorer上