javascript - window.scroll()函数未触发

我有一个功能，当单击菜单项时，它应该导致窗口滚动400像素；

当我单击菜单项时，该函数的内部正在触发，因为我收到了console.log消息，但是窗口没有滚动。我似乎无法解决问题所在。

任何帮助都是极好的。

Codepen：https://codepen.io/emilychews/pen/LQVQrq

JS

var aboutLink = document.querySelector(".menu-item-1 a")

var menuClicked = false;

function aboutClicked () {

    if (menuClicked === false) {

        window.scroll(0, 400);
        menuClicked = true;
        console.log("clicked")

    }
}

aboutLink.addEventListener("click", aboutClicked);

的HTML

<div class="menu-item-1">
  <a href="#">About</a>
</div>

最佳答案

请在侦听器调用中阻止默认事件。下面是代码。

<script type="text/javascript">
            $(document).ready(function () {
                var aboutLink = document.querySelector(".menu-item-1 a");
                aboutLink.addEventListener("click", aboutClicked);

                var menuClicked = false;

                function aboutClicked(event) {
                    event.preventDefault();

                    if (menuClicked === false) {

                        window.scroll(0, 500);
                        menuClicked = true;
                        console.log("clicked");

                    }
                }
            });
        </script>