如何使用jquery增加延迟？

Question

我想在鼠标进入时初始化延迟时间。

我将附上我的代码，并寻求您的建议。

  $(".hasTopSubMenu").on({
        mouseenter: function () {
              $(this).find("ul").show();
              // reset delay time
        },
        mouseleave: function () {
              $(this).find("ul").delay(700).hide(0);                
        }
  });

Answer 1

我认为您正在寻找clearQueue()，请查看下一个实施示例：

$(".hasTopSubMenu").on(
{
    mouseenter: function()
    {
        $(this).find("ul").clearQueue().show();              
    },
    mouseleave: function()
    {
        $(this).find("ul").delay(700).hide(0);                
    }
});

.hasTopSubMenu {
  background: skyblue;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="hasTopSubMenu">
  List
  <ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
  </ul>
</div>