Javascript clearTimeout（）未按预期运行

我有一个带有子菜单的菜单，当你点击一个按钮时，它会滑出。我希望它滑回后7秒，如果它还没有被点击回来。我想在重新单击计时器时重置计时器，以便在再次单击计时器时从开始处开始

    $(".connect").click(function(){
     if($(".slidy-social").css("right") === "0px"){
       $(".slidy-social").animate({right: "200px"}, 250);
       var timer = setTimeout(function(){
         if($(".slidy-social").css("right") !== "0px"){
           $(".slidy-social").animate({right: "0px"}, 250)
         }
       }, 7000)
     }
     else{
       clearTimeout(timer);
       $("#social").animate({right: "0px"}, 300);
     }
   })

---

问题在于，每次调用click listener函数时，您都在创建一个新的

计时器
变量。您需要在函数外部声明变量，以便每次都是相同的变量

var timer;
$(".connect").click(function() {
  if ($(".slidy-social").css("right") === "0px") {
    $(".slidy-social").animate({
      right: "200px"
    }, 250);
    timer = setTimeout(function() {
      if ($(".slidy-social").css("right") !== "0px") {
        $(".slidy-social").animate({
          right: "0px"
        }, 250)
      }
    }, 7000)
  } else {
    clearTimeout(timer);
    $("#social").animate({
      right: "0px"
    }, 300);
  }
})

在这种情况下，我总是遇到超时问题。您尝试过interval吗？注意，您正在两个不同的选择器上调用
.animate（）
，
.slidy social
和
#social
。这就是你想要达到的目标吗？你能在问题中加入HTML吗？如果这解决了问题，你应该接受答案。你还应该回到以前的问题，接受最有用的答案。