jQuery语法错误，无法识别的表达式 [英] jQuery Syntax error, unrecognized expression

问题描述

我有一个脚本，当用户向下滚动页面时，该脚本会使用用户的位置来更新固定菜单.在前端工作是没有错误的，但是现在我开始进行WordPress集成工作时，我收到了一个奇怪的错误消息，我很难理解.

I have a script that updates a fixed menu with the user's position as they scroll down the page. Working on the front-end was error free, however now that I have started working on the WordPress integration I am getting a bizarre error message which I am having trouble understanding.

一次加载页面就可以了，但是，当我向下滚动时，就会出现错误.

One loading the page it is fine, however as soon as I scroll down the error appears.

这是jsfiddle. http://jsfiddle.net/2k4Eq/ 它似乎与完整的URL有关，因为它仅适用于#whatWeDo.

Here is the jsfiddle. http://jsfiddle.net/2k4Eq/ It seems to be related to the full URL, as it works with just #whatWeDo.

Syntax error, unrecognized expression: http://localhost:8888/sitename/#whatWeDo

来自jQuery

 Sizzle.error = function( msg ) {
    throw new Error( "Syntax error, unrecognized expression: " + msg );
 };

谢谢！

// Update menu position on scroll
    $(function() {
        function updateMenu() {

            var lastId,
                mainMenu = $("#main-menu ul"),
                mainMenuInnerHeight = mainMenu.outerHeight(),
                mainMenuItems = $("#main-menu.navigation ul").find(".section-item a"),
                sliderButtons = $("#call-to-actions "),
                sliderLinks = sliderButtons.find("a.button.white"),         

                // Anchors relating to links                    
                scrollItems = mainMenuItems.map(function(){
                  var item = $(this).attr("href");
                  if (item.length) { return item; }
                });
                console.log(scrollItems);


            mainMenuItems.bind("click",scrollDown);
            sliderLinks.bind("click",scrollDown);

            function scrollDown(e){
                e.preventDefault(); 

                var href = $(this).attr("href"),
                    offsetTop = href === "#" ? 0 : $(href).offset().top;

                $("html, body").stop().animate({ 
                    scrollTop: offsetTop
                }, 600);

                $("#main-mobile-menu").hide();

            }   

            $(window).scroll(function(){
                var fromTop = $(this).scrollTop()+mainMenuInnerHeight;

                var cur = scrollItems.map(function(){
                    if ($(this).offset().top < fromTop)
                        return this;
                }); 


                cur = cur[cur.length-1];

                var id = cur && cur.length ? cur[0].id : "";

                if (lastId !== id) {
                    lastId = id;            

                    mainMenuItems
                        .parent().removeClass("active")
                        .end().filter("[href=#"+id+"]").parent().addClass("active");
                }                   
            }); 

        }

        updateMenu();   
        $(window).resize(function(){
            updateMenu();
        });
    });

推荐答案

此问题是由于尝试使用完整的URL而不是仅使用哈希和ID引起的.通过拆分结果并仅使用锚点，可以确保脚本仍能运行，但也意味着从另一个页面导航至更正主页部分仍然有效.感谢那些帮助我使我思考并最终引导我走上正确道路的人.

The issue was caused by trying to use full URL other than just the hash and ID. By splitting the results and only using the anchor ensured the script still ran, but also meant navigating to the correction homepage section from another page still worked. Thanks to those who helped as it got me thinking and eventually lead me down the right path.

$(function() {
function updateMenu() {

    var lastId,
        mainMenu = $("#main-menu ul"),
        mainMenuInnerHeight = mainMenu.outerHeight(),
        mainMenuItems = $(".home .navigation ul").find("li.section-item a"),        

        scrollItems = $(".navigation li.section-item a").map(function() {
            itemsSplit = $(this).attr("href").split("#");
            itemHref = $("#" + itemsSplit[1]);

            return itemHref;
        });     

    mainMenuItems.bind("click",scrollDown);

    function scrollDown(e){
        e.preventDefault(); 

        var href = $(this).attr("href").split("#"),
            hrefSplit = href[1],

            offsetTop = $("#" + hrefSplit).offset().top;        

        $("html, body").stop().animate({ 
            scrollTop: offsetTop
        }, 600);
    }   

    $(window).scroll(function(){

        var fromTop = $(this).scrollTop()+mainMenuInnerHeight;

        var cur = scrollItems.map(function(){               
            if ($(this).offset().top < fromTop) 
                return this;
        });

        cur = cur[cur.length-1];

        var id = cur && cur.length ? cur[0].id : "";

        if (lastId !== id) {
            lastId = id;

            mainMenuItems
                .parent().removeClass("active")
                .end().filter("[href$="+id+"]").parent().addClass("active");
        }                   
    });
}

updateMenu();   
$(window).resize(function(){
    updateMenu();
});
});

这篇关于jQuery语法错误，无法识别的表达式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！