jquery - SetTimeout 在 jquery 中不起作用

Question

我正在尝试在单击事件上添加和删除一个类，它类似于突出显示一个元素，但这里没有发生任何事情:(。这是我的代码：JQ：

var listed=($('.vis').size())-1,
btn=$('.compare-btn');
  listed < 5 ? listed>=2?btn.show(500):null):btn.text("more").addClass('border').setTimeout(btn.removeClass('border'),2000);

CSS：

.border{border:2px solid red;width:95%!important;}

请让我知道这段代码有什么问题

Answer 1

setTimeout是一个内置的 JavaScript 方法，它不是 jQuery 的一部分，请参阅MDN 文章。

重构

btn.text("more").addClass('border').setTimeout(btn.removeClass('border'),2000);

至：

btn.text("more").addClass('border');
setTimeout(function(){

    btn.removeClass('border');

},2000);

我也认为三元运算符对您的代码没有太大帮助。这使它有点不可读。请考虑改用更简单的if-else构造，特别是如果您不使用返回值。

如果您愿意，可以使用 jQuery .delay函数来完成与您尝试的类似的语法this。我建议你继续使用setTimeout，它更简单、更原生。

Answer 2

setTimeout 不是 jquery 函数。它需要在自己的线路上：

var listed=($('p').size())-1,
    btn=$('.compare-btn');
    if(listed < 5) {
      if(listed>=2) {
         btn.show(500);
      }
      else {
         null;
      }
    }
    else
    {
       btn.text("more").addClass('border');
    }
}

setTimeout(function(){btn.removeClass('border'); } ,2000);