1.方法一:用定时器定时,没跑完定时器,点击按钮无效
<script>
var isClick = true;
$("button").on("click",function(){
if(isClick) {
isClick = false;
//事件
console.log('我被点击了');
//定时器
setTimeout(function() {
isClick = true;
}, 1000);//一秒内不能重复点击
}else{
console.log('请勿过快点击');
}
});
</script>

  

2.方法二:用两次时间差决定点击是否有效——参考地址如下:

https://www.cnblogs.com/clear93/p/8086374.html

var lastClick;
lockClick(){
var nowClick = new Date();
if (lastClick === undefined) {
lastClick = nowClick;
return true;
} else {
if (Math.round((nowClick.getTime() - lastClick.getTime())) > 500) {
lastClick = nowClick;
return true;
}
else {
lastClick = nowClick;
return false
}
}
} this.on('click',()=>{
if (this.lockClick()) {
//你的函数代码
}
})

  

三.方法三:比如每次点击的时候给按钮一个500毫秒的遮罩闪现来遮盖按钮

(节流)js防止重复频繁点击或者点击过快方法的更多相关文章

  1. JS变量重复声明以及忽略var 声明的问题及其背后的原理

    腾讯的一个笔试题,先看一下 var a = 100; function fn() { alert(a); //undefined var a = 200; alert(a); //200 } fn() ...

  2. 通过js或jq增加的代码,点击事件或其他一些事件不起作用时

    通过js或jq增加的代码,点击事件或其他一些事件不起作用时,可使用 $(document).on("click",".noshow",function() { ...

  3. 【repost】 JS变量重复声明以及忽略var 声明的问题及其背后的原理

    JS的容错率很高,一些其他语言常见的小错误JS都能大度得包容,比如给一个方法传入超出预计的参数.在声明变量之前使用该变量(变量的声明提升解决了这个问题)等等,这里我们就要解剖一下JS变量重复声明以及当 ...

  4. js 去掉重复数组

    js去掉重复数组 重点一:字符串转数组  strArr.join(',') 重点二:做循环数组删除的时候,每次循环就把color[i] 去对比i之前所有数组color组合起来的字符串 比如 : i=1 ...

  5. js遍历添加栏目类添加css 再点击其它删除css

    //js遍历添加栏目类添加css 再点击其它删除css $(".radio-group .ckselect").each(function(index) { $(this).cli ...

  6. webdriver js点击无法点击的元素

    原文地址https://blog.csdn.net/galen2016/article/details/56847545 [WebDriver]调用JavaScript 一.WebDriver 提供了 ...

  7. js 实现table表格拖拽和点击表头升降序排序

    js 实现table表格拖拽和点击表头升降序排序,写的比较乱,用的时候可以把其中的一些模块函数提取出来 样式,由于是可拖拽表格,所以样式 table tr th{cursor:move;} js实现 ...

  8. js进阶 12-16 jquery如何实现通过点击按钮和按下组合键两种方式提交留言

    js进阶 12-16 jquery如何实现通过点击按钮和按下组合键两种方式提交留言 一.总结 一句话总结:实现按下组合键提交留言是通过给input加keydown事件,判断按键的键码来实现的. 1.如 ...

  9. JS 防止重复提交

    JS 防止重复提交表单 利用flag自定义设置,缺点就是当页面有很多类似操作时,每次需要一个 方法二: var newtime = 0; function sub(){ var Today = new ...

  10. 【转】第7篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:全自动注册与反射方法分析

    作者: 牛A与牛C之间 时间: 2013-12-12 分类: 技术文章 | 2条评论 | 编辑文章 主页 » 技术文章 » 第7篇:Xilium CefGlue 关于 CLR Object 与 JS ...

随机推荐

  1. 将MindSpore运行结果输出到log文件

    技术背景 我们在Linux系统下使用一些深度学习框架(如MindSpore)运行脚本的时候,经常会用一些打印输出来判断当前执行的步骤,或者是使用打印输出来定位算法问题.但是在Linux系统下程序输出其 ...

  2. gitee的 私人令牌 就是 Gitee Open API 的 access_token

    gitee的 私人令牌 就是 Gitee Open API 的 access_token

  3. stm32 文件系统数据读写源码解析

    一 概念 fatfs文件系统在文件读写中不可或却.熟悉和深入理解是一个不可或缺的前提. 这里面需要先明确几个概念:文件open的属性,这个非常重要.可以并列使用. 二  源码解析 A  写入数据: i ...

  4. github无法访问?vscode 无法使用github登录同步? 改 hosts 吧

    一.无法访问 github.com ? 想要去 github.com 上拿来主义,结果访问不了,或者 npm 时一直失败? 是什么原因不用问,直接使用 https://tool.lu/ip/  查询到 ...

  5. makefile 编写要点

    PS:要转载请注明出处,本人版权所有. PS: 这个只是基于<我自己>的理解, 如果和你的原则及想法相冲突,请谅解,勿喷. 前置说明   本文作为本人csdn blog的主站的备份.(Bl ...

  6. centos如何换源

    centos如何换源? 万事先备份 mkdir -p /etc/yum/backup/ cp -r /etc/yum.repos.d/* /etc/yum/backup/ 1.将源文件备份 cd /e ...

  7. 直播预告:面对技术带来的新机遇,CG人如何腾飞?

    "新锐先锋,玩转未来"--首届实时染3D动画创作大赛由瑞云科技主办,英伟达.青椒云.3DCAT实时渲染云协办,戴尔科技集团.Reallusion.英迈.万生华态.D5渲染器.中视典 ...

  8. .NET集成DeveloperSharp操作Sql Server数据库

    支持.Net/.Net Core/.Net Framework,可以部署在Docker, Windows, Linux, Mac. 本文提供了一种结合"原生Sql+轻量级ORM"操 ...

  9. App启动流程

    目录介绍 1.什么是Zygote进程 1.1 简单介绍 1.2 各个进程的先后顺序 1.3 进程作用说明 2.Zygote进程的启动流程 2.1 源码位置 2.2 ZygoteInit类的main方法 ...

  10. Vue3.0里为什么要用 Proxy API 替代 defineProperty API ?

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 一.Object.defineProperty 定义:Object.defineProperty() 方法会直接在一个对象上定义一个新属性 ...