程序员经验分享-hwhale

2020/1/27 在setInterval中使用setTimeout时遇到的问题

2023-05-16

这几天在做一个简单的随机抽取姓名的一个抽人的小页面

顺顺利利的

今天回来再打开看自己作死一样的一直找看看有没有什么bug

没想到真的找到一个

花了一个多小时才解决

其实最后才觉得是个比较细节的问题

是关于setInterval和setTimeout的

这是修改前：

是一个点击事件内的代码

当我点击时，出现了这样的效果：

也就是说，每一个打印他都执行了6次；

其实这样说也不恰当，准确来说应该是内层的setTimeout函数执行了6次，为什么呢？

我一开始以为是同步异步的问题

但是毫无疑问，他们是异步执行这个因素我早已考虑在内，不然我怎么会用setTimeout来延迟呢

所以我百思不得其解

如图：

这就是点击事件

因为出现的bug是，即使我设置了ifStart这个变量作为能否点击的标杆，当我鼠标连点时，还是会多次出现这样的打印结果：

也就是说

这句代码被重复执行了，也也也就是说点击事件生效了，那我标杆干嘛去了，点一次就直接失效了，必须等

这行代码执行了才可以再点啊

当然这是理想情况，如果确实如此那还有个屁的bug

总结打印的结果我发现的问题所在

就是内层延迟函数即outid = setTimeout的延迟时间为250ms，而包裹它的setInterval间隔时间缺只有50ms

也就是说在第一个setTimeout执行时，setInterval已经重复了250/50+1次，即我们看到的6次，定义了6次outid = setTimeout

既然看清楚了问题所在，那么问题就好解决了

只需更改这两处就行了，令var outid = setTimeout只执行一次就可以了

再看打印结果：

成功！

这样ifStart就不会被连续赋值为true导致点击事件连点时在这个时间段内生效。

 

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

2020

setInterval

setTimeout

时遇到的问题

2020/1/27 在setInterval中使用setTimeout时遇到的问题 的相关文章

  • setInterval 中的 JavaScript 函数

    我有以下代码 var foo 5 var los function alert foo setInterval los 1000 哪个工作正常 如果我将其更改为 var los function alert foo setInterval

  • 使用相同的 URL 替换弹出窗口 URL

    我需要用相同的 URL 替换 myWindow window open 弹出窗口 URL 但不知道如何操作 我相信我应该使用 setTimeout 但我不知道如何或在哪里放置它 这是我正在使用的编码

  • 检查 JavaScript setTimeout 是否已触发

    我希望能够通过 JavaScript 分派大量工作在浏览器中完成 从而使浏览器始终保持响应能力 我尝试采取的方法是将工作分块 将每个块传递给一个函数 然后用一个函数排队setTimeout func 0 call 我需要知道所有工作何时完成

  • 如何更改 setInterval 和 setTimeout 函数中“this”的范围

    怎么可能使用this代替setInterval and setTimeout calls 我想这样使用它 function myObj this func function args setTimeout function this fun

  • 为什么clearTimeout没有清除这个react组件中的超时？

    我试图在启动新的超时之前清除以前的超时 因为我希望消息显示 4 秒并消失 除非在 4 秒结束之前弹出新消息 问题 旧的超时正在清除当前消息 因此在这种情况下 clearTimeout 在此组件中不起作用 let t t for timer

  • setInterval 具有自动执行功能

    我想立即运行我的函数 没有超时 所以我这样做 setInterval function alert Boo 1000 该函数第一次执行 但在接下来的时间间隔中 没有任何反应 为什么 更好的问题是 您实际上想要实现什么目标 你不return自

  • Javascript 中是否按顺序执行相等的超时？

    假设我这样做 setTimeout foo 0 setTimeout bar 0 我可以确定 foo 会在 bar 之前开始执行吗 如果我使用 1 10 或 100 的超时值代替 0 会怎么样 简单的实验表明 在超时值相等的情况下 超时目标

  • 设置超时 Internet Explorer

    我在 MSIE 中有以下 javascript setTimeout myFunction 1000 param 这似乎适用于除 Internet Explorer 之外的所有浏览器 参数只是没有转发到函数 查看调试器 它是未定义的 par

  • 如何在Javascript中延迟setInterval？

    我现在在 JavaScript 中反复遇到一个奇怪的问题 我似乎无法拖延setInterval longer 发生情况的一个小例子 var loop var count loop setInterval start 30 function

  • 如何将参数传递给使用 setTimeout 调用的函数？

    我想将参数传递给名为 using 的函数setTimeout 我找到了这三个选项 A 1 Method 1 closure things setTimeout function whatsA A 100 Method 2 third arg

  • JavaScript setInterval 立即运行

    我找到了一种立即在 javascript 中运行间隔的解决方案 而不是等待第一个 超时 setInterval function hello console log world return hello 2500 但问题是这个解决方案不起作

  • javascript setTimeout 调用错误

    我想调用window setTimeot https developer mozilla org en DOM window setTimeout功能与我的自定义范围 所以我使用call https developer mozilla or

  • 带有阻塞代码的 setTimeout 行为

    这是我的测试代码 小提琴here http jsfiddle net Xvh55 console log Before wait setTimeout function console log Yo 1000 var start Date

  • HTML5 视频自动播放，但有 5 秒延迟

    我的网页上有一个 20 秒长的 HTML5 视频循环作为背景 并将其设置为自动启动 视频自动播放可以延迟5秒吗 我试图在尝试播放之前让视频完全加载 以防止视频卡顿 这是我当前的代码

  • 防止 javascript setInterval 函数堆积

    我有一个在单击事件上运行的函数 该函数对我的一些动画 我正在做一个游戏 使用javascript的setIterval 所以问题是 如果用户在动画仍在显示时单击 setInterval仍在执行 则setInterval在事件堆栈中堆积 或者

  • 如何保留setTimeout参数值直到执行？

    我有一些在按键时执行的代码 并在用户键入时将数据保存到数据库中 我添加了一个 setTimeout 函数 前面有一个clearTimeout 因此并非用户输入的每个字符都会发送 Ajax 请求来保存数据 虽然 setTimeout 对于一个

  • 使用 React 定期运行 fetch

    我有一个包含不同反应组件的网格 所有组件都是独立的 因为它们获取自己的数据并显示它 我想以某种方式让它们每 15 分钟自动重新获取和更新一次 我的第一个想法是 HOC 但是随着更新的钩子和功能组件的出现 我尝试了一些使用钩子的东西 所以我已

  • 在 Promise 链上使用 setTimeout

    在这里 我试图围绕承诺进行思考 在第一个请求中 我获取一组链接 在下一个请求中 我获取第一个链接的内容 但是我想在返回下一个承诺对象之前进行延迟 所以我使用setTimeout就可以了 但它给了我以下 JSON 错误 without set

  • SetTimeout() 不会执行该函数

    这是我的代码片段 in VBScript Sub Main Dim timeoutTimer more scripts here more scripts here more scripts here timeoutTimer window

  • setInterval 会导致浏览器挂起吗？

    几年前 我被警告不要使用setInterval很长一段时间 因为如果被调用的函数运行时间超过指定的时间间隔 可能会导致浏览器挂起 然后无法跟上 setInterval function foo bar i 1 现在 我知道在循环中添加大量代

随机推荐

  • 浅谈现代无人机技术

    摘要 xff1a 在物联网技术 电池能源技术 传感器技术不断发展的今天 xff0c 无人机技术也变得日趋成熟起来 xff0c 成为一大热门技术 笔者主要对当下的无人机技术做出简单的分析 xff0c 并且简单实践复现该项技术 囊括 xff1a

  • c++数组初始化

    静态数组 span class token keyword int span dp span class token punctuation span span class token number 1 span span class to

  • PID控制器主要针对线性系统还是非线性系统

    PID控制器可以用于线性系统和部分非线性系统 PID控制器最初是为线性系统设计的 xff0c 可以有效控制具有稳定线性动态特性的系统 xff0c 如电机控制 温度控制等 但是 xff0c PID控制器也可以应用于一些非线性系统中 xff0c

  • VNC远程登录服务器（Ubuntu14.04）

    使用服务器多用户登录 xff0c 使用命令行没有图像化界面 xff0c 难免有所不便 xff0c 就来搞下VNC远程登录Ubuntu14 04 1 使用命令行登录进行vnc安装 sudo apt get install vnc4server

  • 树莓派4b使用记录(一)：在树莓派4b使用python-opencv打开海康工业相机及遇到的问题与解决方法

    树莓派4b使用记录 一 xff1a 在树莓派4b使用python opencv打开海康工业相机及遇到的问题与解决方法 一 在树莓派上安装海康工业机器人的MVS软件 xff08 Linux版本 xff09 海康工业机器人软件下载地址 xff1

  • react 的性能优化

    一 性能永远是第一需求 xff0c 时刻考虑性能问题 如何避免应用出现性能问题 xff0c 如下所示 xff1a 了解常见的性能问题场景时刻注意代码的潜在性能问题注重可重构的代码了解如何使用工具定位性能问题 二 网络性能优化 xff0c 自

  • STM32应用之485通信

    我们先看看普通的收发电路 普通的485电路 xff0c 除了 用RXD连接485芯片的RO引脚 用TXD连接485芯片的DI引脚 xff0c 还会用一个单片机的普通IO引脚连接到RE DE引脚上 当单片机要发送数据的时候 xff0c 控制P

  • AD铺铜技巧总结

    原文链接 xff1a https blog csdn net snaking616 article details 78643046 目录 1 铜皮操作分类 2 铺铜技巧 2 1 过孔处理 2 1 1 过孔与绿油 2 1 2 过孔的十字连接

  • 十大滤波算法

    一 限幅滤波 1 xff09 方法 根据经验判断两次采样允许的最大偏差值A 每次采新值时判断 xff1a 若本次值与上次值之差 lt 61 A xff0c 则本次有效 xff1b 若本次值与上次值之差 gt A xff0c 本次无效 xff

  • 初识GD32

    什么是GD32 xff1f GD32是由北京兆易创新开发的国产32位MCU xff0c 基于Arm Cortex M3 M23 M4内核的32位通用微控制器 目前已经推出GD32F1xx xff0c GD32F2xx xff0c GD32F

  • GD32 新建工程模板

    本文以GD32F450MCU为核心 xff0c 新建工程模板 准备资料 xff1a GD32F4xx Firmware Library V2 1 0 GD32F4Pack包 http www gd32mcu com cn download

  • VirtualBox安装Win10系统

    VirtualBox是一款免费的开源虚拟机 xff0c 它简单易用 xff0c 支持Windows Linux和Mac系统等 最重要的是安装简单 xff0c 操作方便 装机准备 Windows10镜像文件 VirtualBox软件 Virt

  • SMT32H7系列DMA和DMAMUX的一点理解

    DMA和DMAMUX DMA xff1a 无CPU参与下直接进行数据搬运的控制器 DMAMUX xff1a 建立DMA请求和DMA通道之间的映射关系 xff0c 类似于路由的功能 无DMAMUX的MCU xff0c DMA请求和DMA通道的

  • 基于STM32的UVC设备枚举解析

  • ERP实施顾问与项目经理的区别

    来到青岛出差 xff0c 再次见识了青岛的美丽 xff0c 特别是在这个秋天时节 xff0c 天气宜人 xff0c 看来是一个放假休养的好时节 可惜过来是工作的 xff0c 不然倒是可以在这里呆上一段时间 xff0c 在海边看看书 xff0

  • RTOS随笔之FreeRTOS

    RTOS几点思考 为什么使用RTOS 1 先考虑OS有什么特点 xff1f 2 再考虑什么情况下使用OS FreeRTOS调试技巧任务管理1 任务调度流程2 任务栈大小 xff0c 栈溢出检测3 中断管理4 内存管理 FreeRTOS AP

  • RTOS随笔之FreeRTOS启动与同步方法

    RTOS启动与同步机制 RTOS启动任务切换场景任务同步机制队列信号量事件组任务通知 任务延时 RTOS启动 FreeRTOS在任务创建完成后调用函数vTaskStartScheduler 启动任务调度器 vTaskStartSchedul

  • LTspice仿真命令

    交流扫描 命令 ac lt oct dec lin gt 参数1 xff1a 扫描方式 xff08 oct 八倍频 dec 十倍频 lin 线性扫描 xff09 参数2 xff1a 扫描数 参数3 xff1a 起始频率 参数4 xff1a

  • LTspice创建模型

    由于刚开始接触电路 xff0c 对于电路调试并不是很清楚 xff0c 只是通过查找资料 xff0c 帮助文档学习 xff0c 其中深奥的东西目前并不是很理解 xff0c 只是相互学习 LTspice创建模型的方法 xff1a 通过导入PSP

  • 2020/1/27 在setInterval中使用setTimeout时遇到的问题

    这几天在做一个简单的随机抽取姓名的一个抽人的小页面 顺顺利利的 今天回来再打开看自己作死一样的一直找看看有没有什么bug 没想到真的找到一个 花了一个多小时才解决 其实最后才觉得是个比较细节的问题 是关于setInterval和setTim

热门标签