代码之家 › 专栏 › 技术社区 › Jayson

jQuery的removeClass或toggleClass在IE8中不工作?为什么?我怎样才能让它正常工作?

jquery

Jayson · 技术社区 · 15 年前

下面的例子在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);
        }

1 回复 | 直到 15 年前

Sam Hasler zpesk 15 年前

在某些浏览器中,它可能会做你想做的事情,但并不是你想象的那样。

首先,你的参数 toggleClass 与API不匹配。所以 'slow', callback('dostuff') 没有什么可以改变的。

第二,当你通过 callback('dostuff') 你通过了 打电话 那个函数,您不会传递对该函数的引用。

推荐文章

Newbie_Coder · 如何使用Jquery无画布裁剪框架

1 年前

usman610 · Javascript代码在点击回车键和点击按钮时删除行

1 年前

NovoMannen · 导航中的下拉菜单在内容后面重叠

1 年前

Carly · 在页面加载时滑入div,然后单击以滑入和滑出(jQuery)

1 年前

Community wiki · jquery弹出窗口不会用按键关闭,但会点击

1 年前

Community wiki · Smarty IE9请求下载index.php文件(在上传未发生后)?是我的代码出错还是activecollab?

1 年前

Community wiki · 无法从jquery文档调用函数

2 年前

marzouk najib · Uncaught ReferenceError:未定义FullCalendar

2 年前

Pepe · 检查“data”属性是否包含输入值的一部分(jQuery)

2 年前

laurence keith albano · 如何使用Jquery在父类内添加子父类

2 年前