Question

除非我删除else if语句，否则JavaScript无效。一旦我做了，一切都运行得很好，但我真的需要用else if完成的改变。无法弄清楚为什么。它的作用是改变菜单状态，定义了顶部和底部的某个部分，而不仅仅是我页面的顶部。

//MENU COLOR CHANGE

$(document).ready(function() {
    var a = $(".nav-mobile");
    var b = $(".brand-box");
    var c = $(".menu_item");
    var d = $(".facebook-top");
    var e = $(".vk-top");
    var f = $(".menu-item-facebook");
    var g = $(".menu-item-vk");
    var h = $(".head-block");
    var posup = b.position();
    var posdown = h.position();
    $(window).scroll(function() {
        var windowpos = $(window).scrollTop();

        if (windowpos <= posup.top) {
            a.removeClass("nav-mobile-black");
            c.removeClass("menu-item-black");
            d.removeClass("facebook-top-black");
            e.removeClass("vk-top-black");
            f.removeClass("menu-item-facebook-black");
            g.removeClass("menu-item-vk-black");

            $(".menu_item").mouseover(function(){
            $(this).css({"background-color": "rgba(0, 0, 0, 0.1)"});
            });
            $(".menu_item").mouseout(function(){
            $(this).css({"background-color": "rgba(0, 0, 0, 0.0)"});
            });  
        } 
      else if (windowpos >= posdown.top) {
            a.removeClass("nav-mobile-black");
            c.removeClass("menu-item-black");
            d.removeClass("facebook-top-black");
            e.removeClass("vk-top-black");
            f.removeClass("menu-item-facebook-black");
            g.removeClass("menu-item-vk-black");

            $(".menu_item").mouseover(function(){
            $(this).css({"background-color": "rgba(0, 0, 0, 0.1)"});
            });
            $(".menu_item").mouseout(function(){
            $(this).css({"background-color": "rgba(0, 0, 0, 0.0)"});
            }); 
      }
        else {
            a.addClass("nav-mobile-black");
            c.addClass("menu-item-black");
            d.addClass("facebook-top-black");
            e.addClass("vk-top-black");
            f.addClass("menu-item-facebook-black");
            g.addClass("menu-item-vk-black");

            $(".menu_item").mouseover(function(){
            $(this).css({"background-color": "rgba(255, 255, 255, 0.15)"});    
            });
            $(".menu_item").mouseout(function(){
            $(this).css({"background-color": "rgba(255, 255, 255, 0.0)"});
            });
        }

    });
});

Answer 1

你应该在javascript控制台中查看。你很可能会看到像

这样的错误

Uncaught TypeError: Cannot read property 'top' of undefined

我的猜测是页面上没有class="head-block"的元素 - 这意味着windowpos >= posdown.top会抛出错误，导致脚本执行在此时停止。

它不应该影响页面上的其他脚本 - 如果它真的杀死了所有的javascript，它会提示编译错误，但是你所粘贴的内容并不存在。有时您可以在脚本中找到导致此类错误的有趣字符。如果您研究第一种可能性并将其排除在外，请尝试将上述问题中的文本复制回您的脚本中 - 这应该＆＃34;清理＆＃34;它是否有任何有趣的东西。

无论哪种方式，您的第一个呼叫端口应该始终是javascript控制台。如果我的上述建议没有帮助，您应该在控制台中查找错误并编辑您的问题以显示它。

为什么这个＆＃39;否则如果＆＃39;声明不起作用？

1 个答案: