jQuery .delay()不会延迟.html()函数 - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

使用jQuery的delay()延迟执行show()和hide()不起效的解决方法

今天使用 jQuery 的 delay() 来延迟执行 hide() ，发现延时不起效，查了一些资料，找到了其中的原因。...HTML 代码： jQuery 代码: $('#foo').slideUp(300).delay(800).fadeIn(400); 但是使用他来延迟执行 show(）... 和 hide() 却不起效： HTML： test jQuery : $("#test").delay(5000)....看一下 jQuery文档对 delay() 的解释：设置一个延时来推迟执行队列中的项目，它既可以推迟动画队列中函数的执行，也可以用于自定义队列。...声明：本文由w3h5原创，转载请注明出处：《使用jQuery的delay()延迟执行show()和hide()不起效的解决方法》 https://www.w3h5.com/post/351.html

3.8K1 0

JS函数节流和防抖的区分和实现详解

节流概念(Throttle) 按照设定的时间固定执行一次函数，比如200ms一次。注意：固定就是你在mousemove过程中，执行这个节流函数，它一定是200ms（你设定的定时器延迟时间）内执行一次。...如果你一直在触发这个函数并且两次触发间隔小于设定时间，则一定不会到回调函数那一步。...节流（throttle）官方文档解释：创建一个节流函数，在 wait 秒内最多执行 func 一次的函数。该函数提供一个 cancel 方法取消延迟的函数调用以及 flush 方法立即调用。...（防抖动）函数，该函数会从上一次被调用后，延迟 wait 毫秒后调用 func 方法。...debounced（防抖动）函数提供一个 cancel 方法取消延迟的函数调用以及 flush 方法立即调用。

2.4K2 0

您找到你想要的搜索结果了吗？

是的

没有找到

jQuery (二)

使用jQuery处理事件事件处理一个栗子，单击p时背景变成灰色由于es6的箭头函数不支持this的绑定，所以无法使用箭头函数，只能使用匿名函数 html html> html> jquery/3.3.1/jquery.js...() 这会直接添加一个时间延迟到动画队列中。...，即，使用queque()方法，给队列添加一个新函数 // 淡入的显示一个元素，稍等片刻，设置一些文字，然后变化边框,为对队列的操作，添加到队列的最后 $('#message').fadeIn().delay...jQuery.fn是所有jQuery对象的原型对象。如果给该对象添加一个函数，则该函数会成为一个jQuery的方法。

10.8K3 0

06-移动端开发教程-fullpage框架

编写页面结构编写html的页面结构，每个section独占一屏幕，默认显示第一屏。...DOCTYPE html> html lang="en"> 函数，或者说页面初始化完成后的回调函数 afterSlideLoad 滚动到某一水平滑块后的回调函数，与 afterLoad 类似，接收 anchorLink...、direction 4个参数案例1：延迟加载案例：延迟加载, 只需要把src改成data-src --> <source data-src="video.webm

6.4K5 0

06-移动端开发教程-fullpage框架

编写页面结构编写html的页面结构，每个section独占一屏幕，默认显示第一屏。...DOCTYPE html> html lang="en"> 函数，或者说页面初始化完成后的回调函数 afterSlideLoad 滚动到某一水平滑块后的回调函数，与 afterLoad 类似，接收 anchorLink...、direction 4个参数案例1：延迟加载案例：延迟加载, 只需要把src改成data-src --> <source data-src="video.webm

6.5K9 0

也谈 setTimeout

为了理解定时器的内部机制，有一点必须着重强调：延迟时间的精确度无法保证，比如延迟 10ms ，回调函数不一定在 10ms 后执行。...另外，在第一个 js 块中，鼠标点击了，但是事件处理函数不会立刻执行，和 timer 一样，也要等到一个 js block 执行完后才执行。终于，第一个 js 块执行完。...事件处理函数和 timer 都在等待，于是事件处理函数执行， timer 继续等待。在事件处理函数执行过程中，10ms 的 interval 触发了，毫无疑问不会立刻执行，进入队列等待。...setTimeout 总是会在其回调函数执行后延迟 10ms （或者更多，但不可能少），而 setInterval 总是 10ms 执行一次，而不管它的回调函数执行多久。...定时器的代码总是会被延迟到下一个可能的时间点执行，这个时间点很可能比你给定的时间要长。如果 Intervals 的回调执行时间比你给定的 delay 还要长，那么他们会连在一起执行。

1.7K1 0

也谈 setTimeout

为了理解定时器的内部机制，有一点必须着重强调：延迟时间的精确度无法保证，比如延迟 10ms ，回调函数不一定在 10ms 后执行。...另外，在第一个 js 块中，鼠标点击了，但是事件处理函数不会立刻执行，和 timer 一样，也要等到一个 js block 执行完后才执行。终于，第一个 js 块执行完。...事件处理函数和 timer 都在等待，于是事件处理函数执行， timer 继续等待。在事件处理函数执行过程中，10ms 的 interval 触发了，毫无疑问不会立刻执行，进入队列等待。...setTimeout 总是会在其回调函数执行后延迟 10ms （或者更多，但不可能少），而 setInterval 总是 10ms 执行一次，而不管它的回调函数执行多久。...定时器的代码总是会被延迟到下一个可能的时间点执行，这个时间点很可能比你给定的时间要长。如果 Intervals 的回调执行时间比你给定的 delay 还要长，那么他们会连在一起执行。

1.9K10 0

js节流函数和js防止重复提交的N种方法

fn 延时调用函数 * @param Number delay 延迟多长时间 * @return Function 延迟执行的方法 */ var throttle = function (fn,...方式二：普通节流函数方法 /** * 普通节流函数方法 * @param Function fn 延时调用函数 * @param Number delay 延迟多长时间 */ function...throttle(fn, delay) { if (fn....二、设定flag/js加锁 var lock = false; jQuery("#submit").on('click', function () { if (lock) { return...false; } jQuery.post(url, data, function (response) { //TODO:业务代码 lock = false

5.4K12 0

js节流函数和js防止重复提交的N种方法

fn 延时调用函数 * @param Number delay 延迟多长时间 * @return Function 延迟执行的方法 */ var throttle = function (fn,...方式二：普通节流函数方法 /** * 普通节流函数方法 * @param Function fn 延时调用函数 * @param Number delay 延迟多长时间 */ function...throttle(fn, delay) { if (fn....二、设定flag/js加锁 var lock = false; jQuery("#submit").on('click', function () { if (lock) { return...false; } jQuery.post(url, data, function (response) { //TODO:业务代码 lock = false

9.5K4 0

JavaScript类库---JQuery（一）

1、基础： Jquery类库定义了一个全局函数：JQuery(); 别名$.是JQuery在全局命名空间中定义的唯一两个变量。...返回一个新创建的JQuery对象；另：JQuery中定义的许多方法返回值都是JQuery对象(方法的调用者)；JQuery中函数:.each() JQuery中方法：**.each()没有符号; JQuery...HTML文本字符串：(不能是纯文本，会被当做CSS字符串的)返回文本创建好的HTML元素并封装成的JQuery对象；此方式接受可选的第二个参数；1、可以用Document对象来指定与所创建元素相关联的文档...2、可以使用object对象，该对象的属性名是Jquery关键字时，可用于传入属性值；参数为一个函数：文档加载完毕时调用；相当于onLoad()函数；形如$(function(){})或JQuery(...； delay():延迟动画，参数为延迟时间；

4.9K3 0

jquery.countup实现数字滚动

DOCTYPE html> html lang="zh"> jquery.min.js"> jquery.waypoints.min.js...(num) resolve(num) }).then(res => { $('.count .item').countUp({ delay: 10,//动画延迟执行 time: 2000...//动画持续时间 }); }) // 可以直接写 // $('.count').countUp({ // delay: 10, // time:...2000 // }); html>

6.6K2 0

网站开发常用jQuery插件总结(十)菜单插件superfish

易于集成和使用：只需简单的 HTML 和 jQuery 集成即可实现。使用 Superfish 插件的步骤1. ...-- 引入 jQuery --> jquery.com/jquery-3.6.0.min.js"> HTML 结构Superfish 插件通过列表结构来生成下拉菜单，以下是一个简单的 HTML 结构示例： delay：设置鼠标悬停后子菜单延迟显示的时间，单位为毫秒。示例：delay: 200 表示鼠标悬停 200 毫秒后显示子菜单。...如果你需要更复杂的菜单效果，Superfish 插件也支持一些高级选项，比如延迟隐藏、多级菜单样式等，可以根据项目需求灵活配置。

2460 0

JQuery中的动画

一、show()方法和hide()方法这两种方法是jQuery动画的最基本方法。...show()方法和hide()方法在没有带任何参数的情况下，作用是立即显示或者隐藏匹配的元素，不会有任何动画。...PS：callback回调函数适用于jQuery所有的动画效果方法。... 在动画执行过程中如果想对动画进行延迟操作，那么可以调用delay()方法。...使用方法如下： $(this).animate({left:"400px",height:"200px"},3000).delay(1000) delay()方法允许我们将队列中的函数延时执行，它既可以推迟动画队列中函数的执行

4.1K3 0

WEB入门之十八动画特效

那么，jQuery也充分考虑到了这一点，为我们提供了能实现自定义动画的animate()和delay函数，见表8-1-4所示。...表8-1-4 自定义动画函数函数说明 animate( ) 这是jQuery中创建自定义动画的函数 delay( ) 延时推迟动画 animate函数允许开发人员灵活控制任何属性以实现动画特效，...("播放"); } ); } } ) delay函数用来延时推迟后面动画的执行，在执行一系列动画时比较有用...该函数有一个参数，用来设置延迟的时间，单位是毫秒。..." height="179" style="display:none"/> html> $("#ad").slideDown("slow").delay(5000)

1.3K1 0

WEB入门之十八动画特效

那么，jQuery也充分考虑到了这一点，为我们提供了能实现自定义动画的animate()和delay函数，见表8-1-4所示。...表8-1-4 自定义动画函数函数说明 animate( ) 这是jQuery中创建自定义动画的函数 delay( ) 延时推迟动画 animate函数允许开发人员灵活控制任何属性以实现动画特效，...("播放"); } ); } }) delay函数用来延时推迟后面动画的执行，在执行一系列动画时比较有用。...该函数有一个参数，用来设置延迟的时间，单位是毫秒。...height="179" style="display:none"/>html>$("#ad").slideDown("slow").delay(5000).fadeOut

1.2K1 0

写一个网页进度 loading

那么很简单，我们第一时间想到的就是window.onload：（以下内容为了方便演示，默认使用jQuery，语法有es6的箭头函数） var $loading = $('#loading') var...(prg + '%') console.log(prg) }, delay) } 我们得到了一个progress函数，这个函数就是我们主要的功能模块，通过传入一个目标值、一个时间间隔，就可以模拟进度的演化过程..., callback) } $progress.html(parseInt(prg) + '%') console.log(prg) }, _delay) } function...，使它们不会互相覆盖。..., callback) } $progress.html(parseInt(prg) + '%') console.log(prg) }, _delay) } function

2.9K9 0

看不完的那种！前端170面试题+答案学习整理（良心制作）

可以为它们指定回调函数callback，就是事先规定，一旦运行结束，调用那些函数，但是，在回调函数方面，jquery的功能非常弱，为了改变这一点，jquery开发设计了deferred对象。...$.each()用于遍历jquery对象，返回的是原来的数组，并不会返回一个新数组。...，也会移除元素内部的一切，包括绑定的事件以及与该元素相关的jquery数据 detach()虽然可以将元素自身移除，但是它不会删除数据和绑定事件 57.如何利用jquery，来向一个元素添加或移除css...cdn上下载了jquery文件，再次打开页面时，不会再次下载 59.jQuery.ajax()和jQuery.get()方法之间的区别 ajax()方法更强大，可配置性更强，可以指定等待多久，以及如何处理错误...它和async的区别是，同样在HTML解析期间下载外部的js文件，但是下载完成后不会立即执行js脚本文件，而是等到HTML解析完成后才执行它。

13K5 0

jquery清除定时任务

本文将介绍如何在jQuery中清除定时任务。使用setInterval设置定时任务在jQuery中，通常使用setInterval函数来设置定时任务，该函数按照指定的时间间隔周期性地执行指定的函数。...DOCTYPE html>html> 定时显示提示信息示例 jquery.com/jquery...使用方法setInterval函数的基本语法如下：javascriptCopy codesetInterval(function, delay);function: 指定要执行的函数或代码块。...delay: 指定执行函数之间的时间间隔，以毫秒为单位。...异步执行：setInterval是异步调用的，即它会定时触发函数，不会阻塞后续代码的执行。

1.1K1 0

05-老马jQuery教程-动画

这个动画只调整元素的不透明度，也就是说所有匹配的元素的高度和宽度不会发生变化。..., height: "100%", fontSize: "10em", borderWidth: 10 }, 1000 ); }); // 让指定元素左右移动 // HTML...', opacity: '0.2' }, "slow"); 滚动到顶部案例 $('#btnScrollTop').on('click', function(e) { $('html...延迟执行语法：delay(duration,[queueName]) 概述设置一个延时来推迟执行队列中之后的项目。用于将队列中的函数延时执行。他既可以推迟动画队列的执行，也可以用于自定义队列。...// $('#foo').slideUp(300).delay(800).fadeIn(400); 12. jQuery动画属性设置关闭页面上所有的动画 jQuery.fx.off

2.8K0 0

05-老马jQuery教程-动画

这个动画只调整元素的不透明度，也就是说所有匹配的元素的高度和宽度不会发生变化。..., height: "100%", fontSize: "10em", borderWidth: 10 }, 1000 ); }); // 让指定元素左右移动 // HTML...只有使用了插件来提供这个“easein”函数，这个参数才起作用。...延迟执行语法：delay(duration,[queueName]) 概述设置一个延时来推迟执行队列中之后的项目。用于将队列中的函数延时执行。...// $('#foo').slideUp(300).delay(800).fadeIn(400); 12. jQuery动画属性设置关闭页面上所有的动画 jQuery.fx.off

2.8K5 0

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭