javascript - jQuery 在 Internet Explorer 中无法正常运行

标签 javascript jquery html css internet-explorer

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

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();

    });

});

最佳答案

删除 console.log。

IE 有问题,如果调试器未激活(开发者工具面板打开),它会导致它中断。

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

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

关于javascript - jQuery 在 Internet Explorer 中无法正常运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26276945/

相关文章:

javascript - 当鼠标悬停在某个元素上时,则在该元素下显示其他元素

javascript - 如果用户在未填写表单的情况下单击 "submit",则按钮将全部禁用

javascript - JS 代码中的减号

html - 当子导航下降时,如何防止链接向下移动?

html - 在 Bootstrap 4 中更改屏幕宽度时如何更改导航栏的颜色

javascript - 如何在使用 slideToggle() 显示/隐藏后更改 div 样式

javascript - 当组合框值更改时,JQuery 隐藏行(按属性)

javascript - 我的 react 输入类型 == 数字不起作用

javascript - Cycle2幻灯片youtube

jquery - 完整日历 jquery 中的 eventDrop