IE8 中的 JavaScript 错误 - 预期的 ';' 和 'position(）.lef

JavaScript errors in IE8 - expected ';' & 'position().left' is null

本文关键字：lef position JavaScript 中的 错误 IE8      更新时间：2023-09-26

有人可以帮我吗，在完成之前我无法完成网站，这对我的家人来说是一个惊喜:(

我在IE8中遇到一个错误。这个功能在所有浏览器上都能完美运行，为什么IE会标记错误，我根本听不懂，我只能看到在修复之前没有出路:(请帮助我，一定有一个小故障导致了明显看不见的错误......

这些是错误，如果有人可以帮助我，我将不胜感激。我对脚本感到困惑。

**错误**

消息："position（）.left"为空或不是对象 行： 44 字符： 5 代码： 0

这是第 44 行 - 位于脚本中：

$magicLineTwo

这是脚本的整个代码，这个脚本中没有更多内容，有两组标记为"示例 1 和示例 2"，第二个是制造问题：

 $(function(){
    var $el, leftPos, newWidth,
        $mainNav = $("#example-one"),
        $mainNav2 = $("#example-two");
    /*
        EXAMPLE ONE
    */
    $mainNav.append("<li id='magic-line'></li>");
    var $magicLine = $("#magic-line");
    $magicLine
        .width($(".current_page_item").width())
        .css("left", $(".current_page_item a").position().left)
        .data("origLeft", $magicLine.position().left)
        .data("origWidth", $magicLine.width());
    $("#example-one li").find("a").hover(function() {
        $el = $(this);
        leftPos = $el.position().left;
        newWidth = $el.parent().width();
        $magicLine.stop().animate({
            left: leftPos,
            width: newWidth
        });
    }, function() {
        $magicLine.stop().animate({
            left: $magicLine.data("origLeft"),
            width: $magicLine.data("origWidth")
        });    
    });

    /*
        EXAMPLE TWO
    */
    $mainNav2.append("<li id='magic-line-two'></li>");
    var $magicLineTwo = $("#magic-line-two");
    $magicLineTwo
        .width($(".current_page_item_two").width())
        .height($mainNav2.height())
        .css("left", $(".current_page_item_two a").position().left)
        .data("origLeft", $(".current_page_item_two a").position().left)
        .data("origWidth", $magicLineTwo.width())
        .data("origColor", $(".current_page_item_two a").attr("rel"));
    $("#example-two li").find("a").hover(function() {
        $el = $(this);
        leftPos = $el.position().left;
        newWidth = $el.parent().width();
        $magicLineTwo.stop().animate({
            left: leftPos,
            width: newWidth,
            backgroundColor: $el.attr("rel"),
        });
    }, function() {
        $magicLineTwo.stop().animate({
            left: $magicLineTwo.data("origLeft"),
            width: $magicLineTwo.data("origWidth"),
            backgroundColor: $magicLineTwo.data("origColor")
        });    
    });
});

这有很多错误，所以我不会详细介绍（例如，一个页面上有多个jQuery，DOM上没有引用元素等）。

这适用于我机器上的IE8，您可以随意自己修复有问题的样式。Chrome 或 IE 中没有显示 JS 错误：

http://jsfiddle.net/KyleMuir/ghAkB/15/embedded/result/

这是固定的JS：

$(function () {
    var $el, leftPos, newWidth,
    $mainNav = $("#example-one")
    /*
    EXAMPLE ONE
*/
    $mainNav.append("<li id='magic-line'></li>");
    var $magicLine = $("#magic-line");
    $magicLine.width($(".current_page_item").width())
        .css("left", $(".current_page_item a").position().left)
        .data("origLeft", $magicLine.position().left)
        .data("origWidth", $magicLine.width());
    $("#example-one li").find("a").hover(function () {
        $el = $(this);
        leftPos = $el.position().left;
        newWidth = $el.parent().width();
    $magicLine.stop().animate({
        left: leftPos,
        width: newWidth
    });
    }, function () {
        $magicLine.stop().animate({
            left: $magicLine.data("origLeft"),
            width: $magicLine.data("origWidth")
        });
    });
});

小提琴：http://jsfiddle.net/KyleMuir/ghAkB/15/

希望这有帮助。

相关文章：