JQuery fadeOut()函数与remove()函数合用时不生效的解决办法

前端想要实现一个模块渐隐后被删除,写了这样一行代码:

$("#"+btnID).fadeOut(500).remove();

初看逻辑没什么问题,但是实际效果是fadeOut(500)完全不生效,该模块直接被删除。
后来想到,fadeOut()是动画效果,需要时间执行,但是remove()是立即执行的,所以动画效果没有实现。那么,是不是预留出充足的时间就可以了呢?于是将代码改写为:

let t = 500;
$("#"+btnID).fadeOut(t).delay(t).remove();

测试,依然不生效。发现是因为delay()函数一般是用在动画效果链之间,用来加一个停顿,并不等于程序休眠,即跟setTimeOut()不是一会事。于是代码改成:

let t = 500;
$("#"+btnID).fadeOut(t);
setTimeout(function (){
	$("#"+btnID).remove();
},t);

测试,显示效果终于正常了。
但是这种方法有一个问题,一个是代码比较繁琐,另一个是比较死板,有没有更好的解决办法呢?
其实,fadeOut()函数有一个参数,可以接收回调函数,即callback function,可以在fadeOut()执行完毕后再执行这个回调函数,那么,代码可以写成:

$("#"+btnID).fadeOut(500,function (){
	$(this).remove();
});

测试,效果完全相同。而代码变得简洁高效了。

  animate():对被选元素应用“自定义”的动画。   clearQueue():对被选元素移除所有排队的函数(仍未运行的)。   delay():对被选元素的所有排队函数(仍未运行)设置延迟。   dequeue():运行被选元素的下一个排队函数。   fadeln():逐渐改变被选元素的不透明度,从隐藏到可见。   fadeOut():逐渐改变被元素的不透明度,从可见到隐藏。   fadeTo():把被选元素逐渐改变至给定的不透明度。   hide():隐藏被选的元素。
做项目,测试ie11浏览器发现jqremove方法总是报错, jquery SCRIPT5007: 缺少对象解决思路:    先找要删除的节点的父级节点,然后使用原生js的removeChild方法删除该节点。  var ele = document.getElementById("要删除的节点id"); document.getElementById("要删除节点的父节点id").rem...
我们学完了基本动画就来看看自定义动画吧,怎样自定义呢?我们可以使用animate()方法,该方法含有四个参数,第一个参数是一个对象,我们可以编写要添加动画的属性变化值,第二个参数是动画长,第三个是设置为缓动还是匀速,第四个就是回调函数了: //1.2 为box1制作动画 $('.box').animate({ width:200, left:400, 'background-colo
1.移动与放大缩小 实现动画效果(上/下/左/右移动和放大、缩小效果)的一个前提:在css启用position定位功能后,才可以使用 Animate()这个方法实现动画效果(一般用position:fixed;) eg:上/下/左/右移动 .animate({ top:“100px” }); .animate({bottom:“100px...
1、show()与hide() show()和hide()方法用于显示或隐藏页面中的元素,它的调用格式分别为: $(selector).hide(speed,[callback])和$(selector).show(speed,[callback]) 参数speed设置隐藏或显示的速度值,可为“slow”、“fast”或毫秒数值,可选项参数callback为隐藏或显示动作执行完成后调用的函
jQuery常用的实用回调函数包括以下几种: 1. `$.ajax()`的回调函数:`success`、`error`、`complete`。用于处理Ajax请求成功、失败和完成的回调函数。 2. `$.each()`的回调函数:接受两个参数,分别是索引和值,用于遍历数组或对象的每个元素执行的回调函数。 3. `$.map()`的回调函数:接受两个参数,分别是索引和值,用于对数组或对象中的每个元素进行转换执行的回调函数。 4. `$.when()`的回调函数:用于处理多个异步操作完成后执行的回调函数,可以通过`$.Deferred`对象来管理异步操作。 5. 动画方法的回调函数:例如`fadeIn()`、`fadeOut()`、`slideUp()`等方法,可以在动画完成之后执行的回调函数。 6. 事件处理函数的回调函数:例如`click()`、`change()`等方法,可以在事件触发执行的回调函数。 以上是一些常见的jQuery实用回调函数,可以根据具体需求选择使用。
You are asking Spring Security to ignore Ant(xx) This is not recommended, please use permitAll... 处理 Selenium + webdriver manager遇到 “ConnectionResetError: [WinError 10054] 远程主机强迫关闭了一个现有的连接”异常的解决方法
Selenium + webdriver manager遇到 “ConnectionResetError: [WinError 10054] 远程主机强迫关闭了一个现有的连接”异常的解决方法 You are asking Spring Security to ignore Ant(xx) This is not recommended, please use permitAll... 处理