javascript - 我的导航栏无法点击

Question

在点击导航栏时，它应该指向网站的不同部分，但即使使用 href 和正确的 id 它也没有指向。

更新:在页 footer 分导航中也发生了同样的事情，在页脚中我完美地添加了 JS 的所有类，那么会产生什么问题？

在 safari 浏览器中工作，但在 chrome 和 android 浏览器等其他浏览器中不工作

基本上它是响应式的，但链接不能正常工作。

有什么建议吗？

Github repo - https://github.com/vivanks/hackoffproject

Webpage link - https://vivanks.github.io/hackoffproject/full-page/index.html

<header id="main_menu" class="header">
            <div class="main_menu_bg ">
                <div class="container">
                    <div class="row">
                        <div class="nave_menu wow fadeInUp" data-wow-duration="1s">
                            <nav class="navbar navbar-expand navbar-default" id="navmenu">
                                <div class="container-fluid">
                                    <!-- Brand and toggle get grouped for better mobile display -->
                                    <div class="navbar-header">
                                        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                                            <span class="sr-only">Toggle navigation</span>
                                            <span class="icon-bar"></span>
                                            <span class="icon-bar"></span>
                                            <span class="icon-bar"></span>
                                        </button>
                                        <a class="navbar-brand" href="#">
                                            <font color="black" size="20"><b>{ Hack Off }</b></font></a>
                                    </div>

                                    <!-- Collect the nav links, forms, and other content for toggling -->
                                    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">

                                        <ul class="nav navbar-nav navbar-right">
                                            <li class="active"><a href="#home">Home</a></li>
                                            <li><a href="#domain">About Event</a></li>
                                            <li><a href="#pricing">Us!</a></li>


                                            <li><a href="#footer">Support</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </nav>
                        </div>  
                    </div>

                </div>

            </div>
        </header> <!--End of header -->

Answer 1

您在 main.js 文件中放置了错误的类。请使用如下。

  $('.navbar-collapse').find('a[href*=#]:not([href=#])').click(function () {
    if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
        var target = $(this.hash);
        target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
        if (target.length) {
            $('html,body').animate({
                scrollTop: (target.offset().top - 40)
            }, 1000);
            if ($('.navbar-toggle').css('display') != 'none') {
                $(this).parents('.container').find(".navbar-toggle").trigger("click");
            }
            return false;
        }
    }
});