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. Zabbix“专家坐诊”第182期问答汇总

    问题一: Q:像烽火.浪潮这种没有ilo的设备怎么监控他们的硬件状态呢? A:如果没有ilo,可以使用其他硬件监控软件,例如HP Insight Manager.IBM Director.Dell O ...

  2. $help console 里面的入口帮助文档

    $help console 里面的入口帮助文档 Object.defineProperty(window, '$help', { get: function() { // 这里面this是window ...

  3. be动词 系动词 连缀动词 Linking Verb

    be动词 系动词 连缀动词 Linking Verb be 原型 am 第一人称单数形式 is 第三人称单数形式 are 第二人称单数和复数形式 been 过去分词 being 现在分词 was 第一 ...

  4. ADS1299开发调试总结之寄存器使用说明简析

    一 前记 在生物生理信号测量领域,ads12xx系列是一个无法绕过去的存在.笔者最近几个项目围绕着动物生理信号测量来做.所以用ads12xx比较多一些. 中间遇到了一些问题,这里做一个总结吧. 二 寄 ...

  5. 启动Eclipse 弹出Failed to load the JNI shared library jvm.dll解决方案

    原因:eclipse的版本与jdk版本不一致 解决方案:两者都安装64位的,或者都安装32位的,不能一个是32位一个是64位.

  6. Grails批改默认启动端口

    Grails修改默认启动端口 Grails默认启动端口号是8080,有几种修改的方式: 一.在官网文档中有介绍: grails -Dserver.port=8090 run-app -Dserver. ...

  7. 记录--vue3的宏到底是什么东西?

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 前言 从vue3开始vue引入了宏,比如defineProps.defineEmits等.我们每天写vue代码时都会使用到这些宏,但是你有 ...

  8. [Java]小功能

    [版权声明]未经博主同意,谢绝转载!(请尊重原创,博主保留追究权) https://blog.csdn.net/m0_69908381/article/details/130858061 出自[进步* ...

  9. elementui中下拉框(select)抖动问题

    将下面样式加入即可 // 处理下拉框中抖动 .el-select .el-input__inner { vertical-align: bottom !important; } 如设置了size属性, ...

  10. 鸿蒙HarmonyOS实战-ArkUI组件(GridRow/GridCol)

    一.GridRow/GridCol 1.概述 栅格布局是一种通用的辅助定位工具,可以帮助开发人员解决多尺寸多设备的动态布局问题.通过将页面划分为等宽的列数和行数,栅格布局提供了可循的规律性结构,方便开 ...