晚上查阅了很多文章,都是避免点击事件多次执行。反过来要是让事件多次执行该如何做?

这里可以配个setTimeout();来执行

这里我们用layui

<link rel="stylesheet" href="./css/layui.css"/>
<script src="layui.js"></script>

<div style="width:100px;height:100px;background-color:red;" onclick="fn();">
</div>
<script>

function fn(){
var odiv = document.getElementsByTagName('div')[0];
odiv.className = 'layui-anim layui-anim-scale'; //给元素添加class
setTimeout(function(){odiv.className = '';},300); //还原,将元素class值删除(延迟执行,在动画效果执行后)
}
</script>

js执行多次事件,而非一次的更多相关文章

  1. JS执行事件

    先贴出几个名词: 同步任务: 在主线程上排队执行的任务,只有前一个任务执行完毕,才能执行后一个任务 异步任务:   不进入主线程,而进入"任务队列"的任务,只有任务队列通知主线程, ...

  2. JS执行机制--事件循环--笔记

    JS的解析是由浏览器中的JS解析引擎完成的.JS是单线程运行,也就是说,在同一个时间内只能做一件事,所有的任务都需要排队,前一个任务结束,后一个任务才能开始.但是又存在某些任务比较耗时,如IO读写等, ...

  3. js多次触发事件,在一定延迟内只执行一次 (事件累加)

    js多次触发事件,在一定延迟内只执行一次的案例: <!DOCTYPE html> <html> <head> <meta charset="UTF- ...

  4. js立即执行函数应用--事件绑定

    js中立即执行函数的应用:应用到事件绑定上. 少说多做,直接运行代码(代码中有注释): <!DOCTYPE html> <html lang="zh"> & ...

  5. 4.Netty执行IO事件和非IO任务

    回顾NioEventLoop的run方法流程 IO事件与非IO任务 处理IO事件 处理非IO任务 聚合定时任务到普通任务队列 从普通队列中获取任务 计算任务执行的超时时间 安全执行 计算是否超时 总结 ...

  6. [JS]笔记12之事件机制--事件冒泡和捕获--事件监听--阻止事件传播

    -->事件冒泡和捕获-->事件监听-->阻止事件传播 一.事件冒泡和捕获 1.概念:当给子元素和父元素定义了相同的事件,比如都定义了onclick事件,点击子元素时,父元素的oncl ...

  7. Node.js实战(九)之事件循环

    Node.js 是单进程单线程应用程序,但是因为 V8 引擎提供的异步执行回调接口,通过这些接口可以处理大量的并发,所以性能非常高. Node.js 几乎每一个 API 都是支持回调函数的. Node ...

  8. Node js 安装+回调函数+事件

    /* 从网站 https://nodejs.org/zh-cn/ 下载 这里用的 9.4.0 版本 下载完安装 安装目录是 D:\ApacheServer\node 一路默认安装 安装后打开cmd命令 ...

  9. js进阶 12 jquery事件汇总

    js进阶 12 jquery事件汇总 一.常用事件 页面载入事件 ready() 文档就绪事件(当 HTML 文档就绪可用时) 鼠标事件 click() 触发.或将函数绑定到指定元素的 click 事 ...

随机推荐

  1. PTA 二叉树路径

    二叉树的路径 (25 分) 二叉树是一种普通的数据结构.给出一棵无限的二叉树,节点被标识为一对整数,构造如下:     (1)树根被标识为整数对(1,1).     (2)如果一个节点被标识为(a,b ...

  2. Nginx数据结构之红黑树ngx_rbtree_t

    1. 什么是红黑树? 1.1 概述 红黑树实际上是一种自平衡二叉查找树. 二叉树是什么?二叉树是每个节点最多有两个子树的树结构,每个节点都可以用于存储数据,可以由任 1 个节点访问它的左右 子树或父节 ...

  3. Git clone 报错 128

    使用tortoiseGit检出项目是报错,错误代码128: 使用git bash检出相同目录时返回 git clone fatal:destination path already exists an ...

  4. 判断List是否为空的问题

    今天公司安排给页面调试Bug,感觉公司人员写的判断判断List是否为空存在一定的问题,公司判断是list!=null这是完全不对的,这只会判断是否有list对象.如果为空,他也会执行if(list!= ...

  5. Android 使用date set命令修改系统时间

    测试环境:android 7.1.1 在adb shell中试图使用 date -s "yyyymmdd.[[[hh]mm]ss]"修改系统系统时间时,会提示 date: Unkn ...

  6. 如何在网页中添加 jQuery。

    转自:http://www.runoob.com/jquery/jquery-install.html 网页中添加 jQuery 可以通过多种方法在网页中添加 jQuery. 您可以使用以下方法: 从 ...

  7. redis内存分配管理与集群环境下Session管理

    ##################内存管理############### 1.Redis的内存管理 .与memcache不同,没有实现自己的内存池 .在2..4以前,默认使用标准的内存分配函数(li ...

  8. 1.Oracle 11g 精简客户端

    大型项目开发中,当属Oracle的使用率最高.通常开发人员的机器上都会装上一个 oracle客户端,但一般我们不会再自己的机器上安装Oracle database,因为我们的项目中有专为开发使用的or ...

  9. (3)TinyXml2的详解及使用

        TinyXml2是开源的c++xml文件解析库,简单实用,非常适合存储简单数据,配置文件,对象序列化等数据量不是很大的操作.   (1)DOM DOM(Document Object Mode ...

  10. .net core 入门一

    官网教程:https://docs.microsoft.com/zh-cn/aspnet/core/getting-started/?view=aspnetcore-3.0&tabs=wind ...