Question

这是我的代码 - 如果我删除.delay(2000)它会起作用，但我想要做的是在2秒后删除它。

 $('.back').on('click', function () {
      $(this).delay(2000).remove();
 });

Answer 1

jquery delay()功能仅适用于队列的＆＃39;效果＆＃39;并且不是javascirpt setTimeout的替代品，更适合在这里使用。

.delay（）方法最适合在排队的jQuery之间延迟   效果。因为它是有限的 - 例如，它并没有提供一种方法   取消延迟-.delay（）不能替代JavaScript的原生代码   setTimeout函数，可能更适合某些用途   例。

来源：jquery delay()

请参阅下面的演示：

＆＃13;

$('.back').on('click', function() {
  setTimeout(() => {$(this).remove()}, 2000);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="back">Some text here</div>

＆＃13;

Answer 2

$('.back').on('click', function () {
    setTimeout(function(){ 
        $('.back').remove();
    }, 2000);
});

你可以在这里看到演示

jsfiddle

Answer 3

You should make your execution wait

＆＃13;

var ele;
$(document).ready(function(){
$('.back').on('click', function () {
			ele = this;
    	setTimeout(function(){ 
    	    $(ele).remove();
  	  }, 1000);
	});
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div class="back" style="background-color:red; height:200px; width:200px;">
</div>

＆＃13;

Answer 4

有两种方法可以隐藏课程.back。如果您使用的是.remove()方法，则延迟将无法正常工作，它与设置.css('display','none')非常相似，因此您必须使用setTimeout()并执行该操作。 delay可以正常使用.fadeOut()，因为它会激活元素不透明度，然后隐藏它。

.remove（） - 当你想删除元素本身时，使用.remove（），   以及里面的一切。除了元素   本身，所有绑定事件和与之关联的jQuery数据   元素被删除。

.fadeOut（） - .fadeOut（）方法动画匹配的不透明度   元素。一旦不透明度达到0，则显示样式属性为   设置为none，因此该元素不再影响页面的布局。

$('.back').on('click', function () {
			setTimeout(function(){
      $('.back').remove();
      },2000);
 });

.back{
  width:200px;
  height:200px;
  background:#ccc;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="back">

</div>

$('.back').on('click', function () {
      $(this).delay(2000).fadeOut();
 });

.back{
  width:200px;
  height:200px;
  background:#ccc;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="back">

</div>

如何使用jquery延迟删除div？

4 个答案: