js防止重复点击
表单元素
disabled 没有之一。
el.prop('disabled', true);
ajax({}).done(function() { el.prop('disabled', false); });
非表单元素
非表单,自然没有 disabled 之说,但可以借助中间变量。
if (el.data().loading === true) return false;
el.data('loading', true);
ajax({}).done(function() { el.data('loading', false); });
配合CSS
最后再配合css就更完美了。
.disabled, button[disabled] { background-color:#ddd; }
下面的例子用jquery。
解决思路,设置一个条件来触发事件:
那么问题来了,怎么设置条件 ?
可以用setTimeout函数来改变条件的值。
function runa(){
console.log('is run');
}
var isRun=true;
$("#set").click(function(){
if(isRun){
runa();
isRun=false;
}
setTimeout(function(){
isRun=true;
},1500) //点击后相隔多长时间可执行
})
js防止重复点击的更多相关文章
- js 防止重复点击
1.添加flag 适用于ajax 表单提交,提交之前flag = false , 提及中,true ,提交后false 2.事件重复点击: <script> var throttle = ...
- 微信小程序使用函数防抖解决重复点击消耗性能问题
wxml: <view bindtap="doubleTap" bindtouchstart="touchStart" bindtouchend=&quo ...
- js 实现控制点击事件在特定的毫秒内 只允许点击一次(防止重复点击)
代码 第一种方法 var forbidRepeartClick = (function(){ var instance = null; var canClick = true; function Bu ...
- js节流函数和js防止重复提交的N种方法
应用情景 经典使用情景:js的一些事件,比如:onresize.scroll.mousemove.mousehover等: 还比如:手抖.手误.服务器没有响应之前的重复点击: 这些都是没有意义的,重复 ...
- 使用JavaScript动态的绑定、解绑 a 标签的onclick事件,防止重复点击
页面上的 a 标签如下: <a class="more" style="cursor: pointer;" id="commentMore&qu ...
- vue防重复点击(指令实现)
快速点击按钮会重复多次调用接口,防止出现这样的情况 全局定义,方便调用 新建plugins.js export default { install (Vue) { // 防重复点击(指令实现) Vue ...
- 限制 button 在 3 秒内不可重复点击
在下载或者上传文件过程中避免重复点击带来的多次同样的请求造成资源浪费,限制 button 的点击次数是很有必要的. 1. 增强用户体验,2. 减轻服务器压力. HTML 代码 <button i ...
- 关于Android避免按钮重复点击事件
最近测试人员测试我们的APP的时候,喜欢快速点击某个按钮,出现一个页面出现多次,测试人员能不能禁止这样.我自己点击了几下,确实存在这个问题,也感觉用户体验不太好.于是乎后来我搜了下加一个方法放在我们U ...
- iOS之防止用户重复点击Button(按钮)问题
在项目中,我们往往会遇到这样的问题:因为网络较慢的原因,用户会不耐烦的一直去点击按钮,这样导致的结果时:相关代码一遍一遍的被重复执行,如果按钮的事件是网络请求的话,这样又导致一种网络请求的循环.所以我 ...
随机推荐
- 【bzoj1318】[Spoj744] Longest Permutation(乱搞)
题目传送门:https://www.lydsy.com/JudgeOnline/problem.php?id=1318 这道题的大意是要求一个长度为len,并包含1~len所有数,并使len最大的子区 ...
- springboot 配置过滤器
能配置例外 先写配置文件类 FilterConfig.java package com.ty.tyzxtj.config; import javax.servlet.Filter; import or ...
- mysql基础(4)-数据导入
如何把数据导入(出)mysql 导出 sql语句 select * from 表名 into outfile "详细路径" fields terminated by ...
- POJ 2482 Stars in Your Window (线段树区间合并+扫描线)
这题开始一直被矩形框束缚了,想法一直都是枚举线,但是这样枚举都需要O(n^2)...但是看了别人的思路,感觉这题思想真心很好(PS:开头好浪漫的描述啊,可惜并没有什么用) 题意就是在平面上给你一些星 ...
- 关于tcp的知识记录
1. 概念 TCP(Transmission Control Protocol,传输控制协议),是一种面向连接的,可靠地,基于字节流的传输层通信协议.当应用层向TCP层发送用于网络间传输的用8位字节表 ...
- JavaWeb -- Jsp中的 EL表达式
lEL 全名为Expression Language.EL主要作用: l获取数据: •EL表达式主要用于替换JSP页面中的脚本表达式,以从各种类型的web域 中检索java对象.获取数据.(某个web ...
- cmscp实例笔记
1.迭代循环 [@NodeList;list] [#list list as node] [#if node.name == "产品试用"] [/#if] [#if node.na ...
- 本地磁盘文件夹共享到虚拟机上的linux系统中
1. 将本地的一个文件夹设置为共享文件 2.点击 虚拟机菜单中的 虚拟机->设置->选项->共享文件夹->总是启用->添加(将上一步骤设置的共享文件夹添加到里面) 3. ...
- SSAS——基础--cube
SSAS——基础 一.Analysis Services Analysis Services是用于决策支持和BI解决方案的数据引擎.它提供报表和客户端中使用的分析数据. 它可在多用途数据模型中创建 ...
- Redis中redis.conf配置总结
redis.conf 配置项说明如下:1. Redis默认不是以守护进程的方式运行,可以通过该配置项修改,使用yes启用守护进程 daemonize no2. 当Redis以守护进程方式运行时,Re ...