jQuery 在 Internet Explorer 中未按预期运行答案

【问题标题】：jQuery not functioning as expected in Internet ExplorerjQuery 在 Internet Explorer 中未按预期运行
【发布时间】：2014-10-09 11:13:32
【问题描述】：

我确定我会因此而失分，因为我无法提供问题的具体细节，但我无法确定是哪个部分导致了问题...

http://thetally.efinancialnews.com/tallyassets/advisors/index.html

这是一个交互式图形，在 chrome 中运行良好。它包含一些在您单击中间的不同按钮时会发生变化的变量，以及一些使用这些变量来调整外部银行大小的动画函数。

在查看了其他一些建议后，我在动画函数中添加了“px”，但没有任何效果。奇怪的是，简单的翻转也使用了动画功能，但使用变量的更高级的则不能。

任何人都可以在 jQuery 中看到任何可能阻止它运行的东西吗？如果您需要更多信息，请告诉我，谢谢

这里是 jQuery：

$(document).ready(function() {

    var title = 0;

    $(".bank").mousemove(function(e) {
        $(this).find('.tooltip').css('left', e.pageX + 10).css('top', e.pageY + 10).css('display', 'block');
    });

    $(".bank").mouseout(function() {
        $(this).find('.tooltip').css('display', 'none');
    });

    var resize = function() {

        $('.bank').each(function() {
            bankName = $(this).attr('class').split(' ')[1];

            var bankSize = window[bankName] * 15;
            var bankNameMargin = bankSize / 2 - bankSize;

            $('.banks .' + bankName).animate({
                width: bankSize + 'px',
                height: bankSize + 'px',
                marginLeft: bankNameMargin + 'px',
                marginTop: bankNameMargin + 'px'
            }, 300);

            if (bankSize == 0) {

                $('.banks .' + bankName).animate({
                    opacity: '0',
                    width: '70px',
                    height: '70px',
                    marginLeft: '-35px',
                    marginTop: '-35px'
                }, 300, "linear", function() {
                    $(this).css({
                        "opacity": "1",
                        "width": "0px",
                        "height": "0px",
                        "marginLeft": "0px",
                        "marginTop": "0px"
                    });
                });
            }

        });

    }

    resize();

    $(".bank").mouseenter(function() {
        $(this).animate({
            width: '+=10',
            height: '+=10',
            marginLeft: '-=5',
            marginTop: '-=5'
        }, 200);
    });

    $(".bank").mouseleave(function() {
        $(this).animate({
            width: '-=10',
            height: '-=10',
            marginLeft: '+=5',
            marginTop: '+=5'
        }, 200);
    });

    $(".button1").click(function() {
        title = 1;
    });

    $(".button2").click(function() {
        title = 2;
    });

    $(".button3").click(function() {
        title = 3;
    });

    $(".reset").click(function() {
        $(".active").removeClass("active");
        $('.banks .bank').animate({
            width: '70px',
            height: '70px',
            marginLeft: '-35px',
            marginTop: '-35px'
        }, 300, "linear");
        title = 0;
    });

    $(".button").click(function(e) {
        $(".active").removeClass("active");
        $(".tooltip p").remove();
        $(".choose").remove();
        $(this).addClass("active");
        console.log(title);
        if (title == 1) {

            $('.barclays .tooltip').append("<p>Deals: 3</p><p>Percentage: 30%</p>");

            barclays = 4;
            hsbc = 2;
            morgan = 4;
            citi = 2;
            baml = 4;
            jpmorgan = 2;
            goldman = 7;
            ubs = 3;
            suisse = 2;
            deutsche = 3;
            jefferies = 2;
            nomura = 1;
            bnp = 1;
            numis = 0;
        } else if (title == 2) {
            barclays = 5;
            hsbc = 3;
            morgan = 3;
            citi = 2;
            baml = 2;
            jpmorgan = 9;
            goldman = 5;
            ubs = 4;
            suisse = 4;
            deutsche = 5;
            jefferies = 1;
            nomura = 0;
            bnp = 1;
            numis = 3;
        } else if (title == 3) {
            barclays = 0;
            hsbc = 0;
            morgan = 5;
            citi = 2;
            baml = 2;
            jpmorgan = 7;
            goldman = 2;
            ubs = 5;
            suisse = 2;
            deutsche = 4;
            jefferies = 2;
            nomura = 5;
            bnp = 2;
            numis = 0;
        }

        resize();

    });

});

【问题讨论】：

你的代码是……什么？
是否有特定版本的 IE 无法使用？
@bboybeatle，有一些方法可以在 Mac 上的 IE 中进行测试。我使用 Mac 并使用 VirtualBox 在 IE 中进行测试。任何值得他的衣服的开发人员都应该可以访问所有浏览器。 Aaaany方式，回到问题。我已经在 IE10 中测试过了，效果很好。
请注意，代码似乎正在成为The Horror of Implicit Globals 的牺牲品。鉴于 IE 比大多数浏览器更多地转储到全局命名空间中，谁知道呢，也许存在某种冲突......
感谢@Kaushik，但在谷歌搜索后，供应商特定的警告似乎不是问题。我现在已经删除了控制台日志，因为那只是为了我的工作。飞，它们是使用每个银行的类名来访问的......（ bankName = $(this).attr('class').split(' ')[1]; ... var bankSize = window[bankName]* 15;)

标签： javascript jquery html css internet-explorer

【解决方案1】：

删除 console.log。

IE 有问题，如果调试器未激活（开发工具面板打开），它会导致它崩溃。

您可以做的是用一个新函数替换 console.log。我喜欢 Paul Irish 的解决方案：

http://www.paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/

【讨论】：