导航菜单在手机上不起作用

Question

我使用一个名为Hamburgler的插件来使用Navigation，它在桌面上运行得非常好。然而，在手机上，导航会出现，但无法点击。

我很抱歉，我要编辑的网站的编码有点粗糙。

导航编码：

JS

    <script type="text/javascript">
    // HAMBURGLERv2
function togglescroll() {
  $('body').on('touchstart', function(e) {
    if ($('body').hasClass('noscroll')) {
      e.preventDefault();
    }
  });
}
$(document).ready(function() {
  togglescroll()
  $(".icon").click(function() {
    $(".mobilenav").fadeToggle(500);
    $(".top-menu").toggleClass("top-animate");
    $("body").toggleClass("noscroll");
    $(".mid-menu").toggleClass("mid-animate");
    $(".bottom-menu").toggleClass("bottom-animate");
  });
});
// PUSH ESC KEY TO EXIT
$(document).keydown(function(e) {
  if (e.keyCode == 27) {
    $(".mobilenav").fadeOut(500);
    $(".top-menu").removeClass("top-animate");
    $("body").removeClass("noscroll");
    $(".mid-menu").removeClass("mid-animate");
    $(".bottom-menu").removeClass("bottom-animate");
  }
});
</script>

HTML

      <a href="javascript:void(0)" class="icon">
    <div class="menui top-menu"></div>
    <div class="menui mid-menu"></div>
    <div class="menui bottom-menu"></div>
               </a>
      <div class="mobilenav">
  <div class="insidenav">
          <a href="/salary-guide-2016" class="inside">2016 Salary Guide</a>
          <a href="https://umd-salary-guide-2015.silk.co/"  class="inside" target="_blank">2015 Salary Guide</a>
          <a href="http://dbk.silk.co/explore/Zj5maAM"  class="inside" target="_blank">2014 Salary Guide</a>
          </div>
</div>

CSS

#navigation {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 80px;
    background-color: #fff;
    z-index: 994;
}
.top-animate {
  background: #e71630 !important;
  top: 13px !important;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
      z-index: 999 !important;
}
.mid-animate {
  opacity: 0;
      z-index: 999 !important;
}
.bottom-animate {
  background: #e71630 !important;
  top: 13px !important;
  -webkit-transform: rotate(-225deg);
  transform: rotate(-225deg);
      z-index: 999 !important;
}
.top-menu {
  top: 5px;
  width: 25px;
  height: 2px;
  border-radius: 10px;
  background-color: #000;
  z-index: 999 !important;
}
.mid-menu {
  top: 13px;
  width: 25px;
  height: 2px;
  border-radius: 10px;
  background-color: #000;
  z-index: 999 !important;
}
.bottom-menu {
  top: 21px;
  width: 25px;
  height: 2px;
  border-radius: 10px;
  background-color: #000;
  z-index: 999 !important;
}
.menui {
  background: #000;
  transition: 0.6s ease;
  transition-timing-function: cubic-bezier(.75, 0, .29, 1.01);
  margin-top: 10px;
  position: absolute;
     z-index: 999 !important;
}
.icon {
  z-index: 999 !important;
  display: block;
  padding: 9px;
  height:  32px;
  width: 32px;
  position: fixed;
    right: 30px;
    top: 15px;
}
.mobilenav {
  font-family: inherit;
  top: 0;
  left: 0;
  z-index: 995 !important;
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  background: #FFF;
    opacity: 0.98;
}
.insidenav {
    position: absolute;
      top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    width: 100%;
    max-width: 300px;
}
a.inside {
    z-index: 2147483647;
    display: block;
    width: 300px;
    height: 70px;
    background-color: #dd152e;
    color: #FFF;
    font-size: 16px;
    font-family: 'Open Sans', sans-serif;
    text-align: center;
    line-height: 70px;
    text-transform: uppercase;
        -webkit-transition: background .5s ease-in-out;
-moz-transition: background .5s ease-in-out;
-ms-transition: background .5s ease-in-out;
-o-transition: background .5s ease-in-out;
transition: background .5s ease-in-out;
    margin-bottom: 50px;
    text-decoration: none;
}
a.inside:hover {
    background-color: #c21228;
}

这是网站本身：http://salaryguide.diamondbacklab.com

对不起，我知道有很多代码要看。如果有任何帮助，我们将不胜感激！

Answer 1

您需要从JavaScript:中删除这些行

if ($('body').hasClass('noscroll')) {
  e.preventDefault();
}

让它发挥作用。因为preventDefault()还阻止标准浏览器行为。