0

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

我在 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")
        });    
    });
});
4

1 回答 1

1

这有很多错误，所以我不会详细介绍（例如，一页上有多个 jQueries，引用的元素不在 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/

希望这可以帮助。

于 2013-10-01T23:58:14.613 回答