Question

以下示例在Firefox和Opera中运行正常，但在ie8中运行不正常。但是，如果我在ie8中打开兼容模式，它可以正常工作。为什么？我该如何解决？

以下示例显示了toggleClass的使用，但将其替换为addClass和removeClass仍然存在同样的问题。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript" src="/jquery/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="/jquery/js/jquery-ui-1.7.2.custom.min.js"></script>
<style type="text/css">
    .dostuff{
        background-color: green;
    }
    .undostuff{
        background-color: red;
    }
</style>
<script language="javascript">

    $(document).ready(function(){
        $('#DoStuffButton').click(function(){doStuff();});
        $('#UndoStuffButton').click(function(){undoStuff();});

        function doStuff(){
            $('#test').html('Do some stuff');
            $('#test').toggleClass('dostuff', 'slow', callback('dostuff'));
        }

        function undoStuff(){
            $('#test').html('Undo some stuff');
            $('#test').toggleClass('undostuff', 'slow', callback('undostuff'));
        }

        function callback(className){
            setTimeout(function(){
                $('#test').toggleClass(className, 'slow');
            }, 1500);
        }


    });
</script>
</head>
<body>
    <div id="test">Blah blah blah</div>
    <div>
        <button id="DoStuffButton" name="DoStuffButton">Do some stuff</button>
        <button id="UndoStuffButton" name="UndoStuffButton">Undo some stuff</button>
    </div>
</body>
</html>

编辑：将javascript更改为以下内容在ie8中也存在同样的问题。任何解释原因，以及如何让它正常工作？

function doStuff(){
            $('#test').html('Do some stuff');
            $('#test').addClass('dostuff', 'fast');
            setTimeout(function(){$('#test').removeClass('dostuff', 'slow');}, 1000);
        }

        function undoStuff(){
            $('#test').html('Undo some stuff');
            $('#test').addClass('undostuff', 100);
            setTimeout(function(){$('#test').removeClass('undostuff', 'slow');}, 1000);
        }

Answer 1

它可能会在某些浏览器上执行您想要的操作，但它并不像您认为的那样执行。

首先，toggleClass的参数与API不匹配。所以'slow', callback('dostuff')对toggleClass毫无意义。

其次，当您通过callback('dostuff')传递调用该函数的结果时，您不会传递对该函数的引用。

jQuery removeClass或toggleClass在ie8中不起作用？为什么？如何让它正常工作？

1 个答案: