限制 button 在 3 秒内不可重复点击
在下载或者上传文件过程中避免重复点击带来的多次同样的请求造成资源浪费,限制 button 的点击次数是很有必要的。 1. 增强用户体验,2. 减轻服务器压力。
HTML 代码
<button id = "test">下载或上传按钮</button>
JS 代码
var foo = function(element) {
var intent = document.querySelector(element)
intent.disabled = 'disabled'
setTimeout(function() {
intent.disabled = ''
}, 3000) /* 可以把 3000 改成自定义的时间*/
console.log('3 秒内不可以重复点击')
}
var bar = function(fun, select) {
var intent = document.querySelector('#test')
intent.addEventListener('click', function() {
fun(select)
})
}
bar(foo, "#test")
限制 button 在 3 秒内不可重复点击的更多相关文章
- OAF 使用 javascript 使某个按钮在5秒内不能重复点击
首先要保证按钮是BUTTON,并且按钮事件设置firePartialAction. public class CuxXXXXPGCO extends OAControllerImpl { public ...
- 使用js使某个按钮在5秒内不能重复点击
<head> <!--参考:http://illy.iteye.com/blog/1534276 --> <!-- http://y.dobit.top/Detail/1 ...
- iOS小技巧–用runtime 解决UIButton 重复点击问题
什么是这个问题 我们的按钮是点击一次响应一次, 即使频繁的点击也不会出问题, 可是某些场景下还偏偏就是会出问题. 通常是如何解决 我们通常会在按钮点击的时候设置这个按钮不可点击. 等待0.xS的延时后 ...
- iOS小技巧:用runtime 解决UIButton 重复点击问题
http://www.cocoachina.com/ios/20150911/13260.html 作者:uxyheaven 授权本站转载. 什么是这个问题 我们的按钮是点击一次响应一次, 即使频繁的 ...
- js 实现控制点击事件在特定的毫秒内 只允许点击一次(防止重复点击)
代码 第一种方法 var forbidRepeartClick = (function(){ var instance = null; var canClick = true; function Bu ...
- 通向高可扩展性之路(推特篇) ---- 一个推特用来支撑1亿5千万活跃用户、30万QPS、22MB每秒Firehose、以及5秒内推送信息的架构
原文链接:http://highscalability.com/blog/2013/7/8/the-architecture-twitter-uses-to-deal-with-150m-active ...
- Jquery插件实现点击获取验证码后60秒内禁止重新获取
通过jquery.cookie.js插件可以快速实现“点击获取验证码后60秒内禁止重新获取(防刷新)”的功能 先到官网(http://plugins.jquery.com/cookie/ )下载coo ...
- 借助 Java 9 Jigsaw,如何在 60 秒内创建 JavaFX HelloWorld 程序?
[编者按]本文作者为 Carl Dea,主要介绍利用 Jigsaw 项目在大约一分钟内编写标准化的"Hello World"消息代码.本文系国内 ITOM 管理平台 OneAPM ...
- iOS防止button重复点击
项目中常会遇到在按钮的点击事件中去执行一些耗时操作.如果处理不当经常会出现连续多次点击push多次的情况,造成不好的用户体验. 一种情况是用户快速连续点击,这种情况无法避免.另一种情况是点击一次后响应 ...
随机推荐
- Linux mv命令(7)
mv命令,move的缩写,顾名思义是移动文件的意思.其实就相当于剪切操作,而前面说的cp命令,就是复制粘贴,这两个有什么区别想必不用多说. 基本使用 使用格式 mv 源文件 目标文件 我的根目录下有 ...
- 洛谷 P3258 松鼠的新家 题解
题面 貌似这道题暴力加玄学优化就可以AC? 下面是正解: 1.树链剖分: 我们在u到v之间都放一个糖果,可以将松鼠它家u到v的糖果数都加1.每一次将a[i]到a[i+1] (a数组是访问顺序)的节点加 ...
- rk3288 编译应用程序
一. Android.mk 1.1. 什么是.mk Android.mk是Android提供的一个makefile文件,可以将源文件分组为模块.用来引用的头文件目录.需要编译的*.c/*.cpp文件. ...
- 利用ansible进行主机信息收集
--- - hosts: myjob gather_facts: True vars: IP: "{{ ansible_default_ipv4['address'] }}" HO ...
- awk对文件的奇偶行做处理
{ if(NR % 2 == 0) printf("%s\n", $0) else printf("%s, ", $1) } awk -f awk.awk da ...
- PHP:ReflectionClass
一.简介 ReflectionClass 类报告了一个类的有关信息 ReflectionException 类继承Exception 二.常用函数 ReflectionClass::__constru ...
- 16.AutoMapper 之可查询扩展(Queryable Extensions)
https://www.jianshu.com/p/4b23e94a7825 可查询扩展(Queryable Extensions) 当在像NHibernate或者Entity Framework之类 ...
- [转载]Ubuntu环境下检查CPU 的温度
原文地址:https://www.linuxprobe.com/ubuntu-cpu-temperature.html 我们将使用一个GUI工具Psensor,它允许你在Linux中监控硬件温度.用P ...
- jenkins配置windows节点遇到的问题
配置:https://blog.csdn.net/liuchunming033/article/details/52025541 错误: 使用slave-agent.jnlp启动时报以下错误,是mas ...
- js 类型转变
在绝大部分情况下,操作符和函数可以自动将一个值转换成正确的数据类型.这被称为"类型转变(type conversion)". 举个例子,alert 自动转变任何类型的参数为字符串类 ...