javascript - 具有延迟调整的 onclick 切换类

Question

我有一个带有 toggleClass 和 setTimeout 功能的按钮，目前它正在根据编写的脚本工作，但我不需要在第一次点击时延迟。 快速隐藏div并延迟显示。现在两个延迟时间相同。谁能帮忙!

$(document).ready(function() {
  $(".button").click(function() {
    window.setTimeout(function() {
      $(".search").toggleClass("hide");
    }, 250);
  });
});

.hide {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<button class="button" type="button">nav</button>
<div class="search"><input type="text" placeholder="Search"></div>

JSFiddle

Answer 1

从未使用过 jquery，但这应该可以工作，不确定它是否是最干净的解决方案。

    $(document).ready(function() {
      $(".button").click(function() {
        if($(".search").hasClass("hide"))
        {
           window.setTimeout(function() {
               $(".search").toggleClass("hide");
           }, 250);
        }
   else $(".search").toggleClass("hide");
      });
    });

.hide {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<button class="button" type="button">nav</button>
<div class="search"><input type="text" placeholder="Search"></div>