0

我是 Web 开发的新手，最近发现了揭示模块模式。但是我在将它实施到我的 JS 中时遇到了问题。

 var navigation = (function(){
    //chache DOM
    var $navBar = $('.navBar');
    var $navBtn = $('.navBar .btn');
    var $section = $('.section');
    var mobileNav = $('.navBarMobile');

    //bind events
    $('.navBar .btn').on('click', sectionScroll());
    //$navBtn.on('click', sectionScroll()); wouldn't run


    //select section via scroll pos.
    function selectScroll(){
        var windscroll = $(window).scrollTop();
        if (windscroll >= 10) 
        {
            $('.section').each(function(i)
            {            
                if ($(this).offset().top -200 <= (windscroll)) 
                {
                    $navBtn.removeClass('selected');
                    $navBtn.eq(i+6).addClass('selected');
                    $navBtn.eq(-i+5).addClass('selected');
                }
            });
        } 
     }

    //scroll to section via click
    function sectionScroll(e){
        e.preventDefault();

        var target = $(this).find('a').attr('data-scroll');
        var offset = $('[data-anchor=' + target +']').offset().top - 100;
        TweenMax.to($('html, body').stop(), 1, {scrollTop: offset, delay:     .36});  
    }

    return {
        selectScroll: selectScroll
    };

    })();

    var main = function () 
    {
        $(window).scroll(function() { navigation.selectScroll(); }).scroll();
    }; 
    $(document).ready(main);

在我的 selectScroll 函数中，它无法正确运行，直到我将“$navBtn”替换为“$('.navBar .btn')”。当我声明变量时我做错了什么吗？

另外，如果我 $navBtn.on('click', sectionScroll()); 用 $('.navBar .btn').on('click', sectionScroll()); sectionScroll 函数替换，总是给我这个错误：无法读取未定义的属性“preventDefault”

编辑：感谢@Bergi on this page ，我发现了问题。我现在的问题是，将这种解决方案与显示模块模式一起使用的最佳方式是什么？是否将 defer 属性放在 JS 上：
<script type="text/javascript" src="js/app.js" defer></script> 或者在使用显示模块模式时是否有更好的解决方案？

4

1 回答 1

1

问题是sectionScroll()。它应该sectionScroll没有括号。使用括号，您正在调用sectionScroll，然后将其返回值传递给on. 当您在没有参数的情况下调用它时，参数eofsectionScroll将是有价值的undefined并且您得到了错误。尝试这个：$('.navBar .btn').on('click', sectionScroll);

于 2015-08-13T02:00:06.020 回答