javascript - 禁用点击并启用双击移动设备

我有一个菜单下拉菜单：

<ul class="navbar">
  <li>
    <a href="">Link</a>
    <ul>
      <li>
        <a href="">Link 2</a>
        <ul>
          <li><a href="">Link 3</a></li>
          <li><a href="">Link 4</a></li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

问题是在移动设备上，单击该子菜单不会立即重定向您的子菜单原因。

因此，我想在移动设备上点击触发悬停并在双击上触发重定向。

我已经尝试过了：

if ($(window).width() < 768) {
  $(".navbar a").on('doubletap', function () {
    window.location = this.href;
    console.log('d');
  });
  $(".navbar a").on('click', function (e) {
    e.preventDefault();
  });
}

但是现在preventDefault（）函数覆盖了doubletap函数。

我需要一些帮助，没有可以帮助我的话题

body {
  margin:0;
  padding:0;
}
.navbar, .navbar ul {
    background:#2D7D9A;
    list-style: none;
    height:50px;
    margin:0;padding:0;
    z-index:2;
    font-family:Verdana, Geneva, Tahoma, sans-serif;
}
.navbar li {
    height:50px;
    float:left;
    line-height:50px;
    padding:0 10px;
}
.navbar li ul {
    background:#0099BC;
    position:absolute;
    margin:0;
    padding:0;
    left:0;
    width:100%;
    display:none;
}
.navbar li ul li {
    display:inline;
}
.navbar li ul li ul {
    background:#038387;
    width:100%;
    /* left:5%; */
    top:45px;
}
.navbar li a {
    color:#bfffff;
    text-decoration:none;
}
.navbar li a:hover {
    color:white;
    text-shadow:1px 1px 10px #bfffff;
}
.navbar li:hover > ul {
    display:block;
}
.navbar li ul li:hover > ul {
    display:block;
}

<ul class="navbar">
  <li>
    <a href="">Link</a>
    <ul>
      <li>
        <a href="">Link 2</a>
        <ul>
          <li><a href="">Link 3</a></li>
          <li><a href="">Link 4</a></li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

最佳答案

实际上，您使用的是错误的方式。首先，您必须在单击时调用此函数，然后才能检查设备宽度。检查出来我的代码。希望这段代码对您有用。谢谢。

$(document).ready(function(){

    $(".navbar a").click(function (e) {
        e.preventDefault();
        if ($(window).width() < 768) {
            $(this).dblclick(function (e) {
                window.location = this.href;
            });
        }
        else{
            window.location = this.href;
        }
    });
});

关于javascript - 禁用点击并启用双击移动设备，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/52987916/