Question

以下代码在IE9 +，Chrome，Firefox，Safari中正常运行，但在IE8上运行不正常。它总是将列高返回0并且宽度不正确。想法？

jQuery版本：1.9.1

$(function ()
{
    $(window).load(function ()
    {
        // Megamenu
        $("#menu-primary > li").one('mouseenter', function (e)
        {
            var tallestColumnHeight = 0,
            submenuPanelTotalWidth = 0;

            $(".dropdown-menu > .dropdown-submenu", this).each(function ()
            {
                $(this).load();

                tallestColumnHeight = Math.max(tallestColumnHeight, $(this).height())
                console.log('tallest column ' + tallestColumnHeight);

                submenuPanelTotalWidth += parseInt($(this).outerWidth(true), 10);
                console.log('panel width ' + submenuPanelTotalWidth);
            }).height(tallestColumnHeight);

            $(".dropdown-menu > .dropdown-submenu", this).parent().width(submenuPanelTotalWidth);
        });
    }); 
});

doctype的样子：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Answer 1

如果您使用的是JQuery 2.0：它不再支持IE 8。

Answer 2

当悬停时通过CSS设置元素的可见性（display：block）时，IE8无法正常工作。使用JS处理显示有效（感谢@zeroflagL提示）：

有效的代码（当然删除console.log行）：

$(window).load(function ()
{
    $("#menu-primary > li").on('mouseenter', function (e)
    {
        var tallestColumnHeight = 0,
        submenuPanelTotalWidth = 0;

        $(".dropdown-menu", this).show();
            $(".dropdown-menu > .dropdown-submenu", this).each(function ()
            {
                $(this).load();

                tallestColumnHeight = Math.max(tallestColumnHeight, $(this).height());
                console.log('tallest column ' + tallestColumnHeight);

                submenuPanelTotalWidth += parseInt($(this).outerWidth(true), 10);
                console.log('panel width ' + submenuPanelTotalWidth);

            }).height(tallestColumnHeight);
            $(".dropdown-menu > .dropdown-submenu", this).parent().width(submenuPanelTotalWidth);        
    }).on('mouseleave', function (e)
    {
        $(".dropdown-menu", this).hide();
    });
});

jquery高度和宽度在Internet Explorer 8中返回不正确的值（ie8）

2 个答案: