0

我的网站结构的简要概述:

主索引 php 通过 ajax 提供本地存储的 php 文件。(如果听起来很乱,那是因为它是)

我在主索引文件中有一个函数,我从 ajax 加载的脚本调用它,它在除 IE 之外的任何地方都可以正常工作。

我无法收到有意义的错误消息:

Invalid argument.  jquery-1.4.2.min.js, line 144 character 219

注意这个问题与我之前的问题直接相关:jQuery $el.position(...) is undefined

jQuery 函数 (index.php)

// nav
var $el;
var leftPos;
var newWidth;
var $mainNav = $("#navbar ul");

$mainNav.prepend("<li id='magic-line'></li>");
var $magicLine = $("#magic-line");

function navBar() {

    // console.log('navBar start');
    function checkActive() {
        // console.log('check active');
        // Hide magic line if nav bar has no active element
        if($('#navbar ul').children('.active').length < 1) {
            $magicLine.hide();
            //console.log($('#navbar ul').children('.active').length < 1);
            //console.log($('#magic-line'));
            //console.log('hide');
        }
        else {
            $magicLine.stop().animate({
                left: $magicLine.css('left', $(".active a").css('left')),
                width: $magicLine.width($(".active a").width())
            });
        }
    }
    checkActive();
    $magicLine
        .width($(".active a").width())
        .css("left", $(".active a").position().left)
        .data("origLeft", $magicLine.position().left)
        .data("origWidth", $(".active a").width());

    // $("#navbar ul li a").hover(function() {
    // apply hover function to li instead and just just el to it's child
    $("#navbar ul li").hover(function() {
        // $el = $(this);
        $el = $(this).children('a');
        // leftPos = $el.position().left;
        leftPos = $el.parent().position().left;
        newWidth = $el.width();
        $magicLine.stop().animate({
            left: leftPos,
            width: newWidth
        }, 600);
    }, function() {
        if($('#navbar ul').children('.active').length < 1) {
            $magicLine.stop();
            checkActive();
        } else {
            $magicLine.stop().animate({
                left: $magicLine.data("origLeft"),
                //width: $magicLine.data("origWidth")
                width: $magicLine.width($(".active a").width())
            }, 600);
        }
    });
}

在我的所有脚本中只需执行以下操作即可调用它:

navBar();

但由于某种原因,它在 IE 中引起了问题,我看不出任何原因。

4

2 回答 2

1

我只是在这里尝试一下,但我会回顾一下:

width: $magicLine.width($(".active a").width())

那是在一个被传递到的对象中.animate()。那条线正在做的是使用jQuery的函数$magicLine将宽度设置为宽度。该函数返回的是对您开始使用的 jQuery 元素的引用,. 这种技术允许您一个接一个地链接 jQuery 函数。.active a.width()$magicLine

因此,上面的行将有效地解决为:

width: $magicLine

我相信你想要的是:

width: $(".active a").width()

试一试,希望是这样!

于 2013-03-01T13:15:01.170 回答
0

明白了,似乎是这一行:

$magicLine
        .width($(".active a").width())
        .css("left", $(".active a").position().left);

将其更改为

$magicLine.stop().animate({
        left: $(".active a").parent().position().left,
        //width: $magicLine.width($(".active a").width())
        width: $(".active a").width()
});

checkActive无论如何,这是在此行之前调用的函数中完成的,所以我只是删除了它....

谢谢你的帮助。

于 2013-03-01T13:50:37.793 回答