在下载或者上传文件过程中避免重复点击带来的多次同样的请求造成资源浪费,限制 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 秒内不可重复点击的更多相关文章

  1. OAF 使用 javascript 使某个按钮在5秒内不能重复点击

    首先要保证按钮是BUTTON,并且按钮事件设置firePartialAction. public class CuxXXXXPGCO extends OAControllerImpl { public ...

  2. 使用js使某个按钮在5秒内不能重复点击

    <head> <!--参考:http://illy.iteye.com/blog/1534276 --> <!-- http://y.dobit.top/Detail/1 ...

  3. iOS小技巧–用runtime 解决UIButton 重复点击问题

    什么是这个问题 我们的按钮是点击一次响应一次, 即使频繁的点击也不会出问题, 可是某些场景下还偏偏就是会出问题. 通常是如何解决 我们通常会在按钮点击的时候设置这个按钮不可点击. 等待0.xS的延时后 ...

  4. iOS小技巧:用runtime 解决UIButton 重复点击问题

    http://www.cocoachina.com/ios/20150911/13260.html 作者:uxyheaven 授权本站转载. 什么是这个问题 我们的按钮是点击一次响应一次, 即使频繁的 ...

  5. js 实现控制点击事件在特定的毫秒内 只允许点击一次(防止重复点击)

    代码 第一种方法 var forbidRepeartClick = (function(){ var instance = null; var canClick = true; function Bu ...

  6. 通向高可扩展性之路(推特篇) ---- 一个推特用来支撑1亿5千万活跃用户、30万QPS、22MB每秒Firehose、以及5秒内推送信息的架构

    原文链接:http://highscalability.com/blog/2013/7/8/the-architecture-twitter-uses-to-deal-with-150m-active ...

  7. Jquery插件实现点击获取验证码后60秒内禁止重新获取

    通过jquery.cookie.js插件可以快速实现“点击获取验证码后60秒内禁止重新获取(防刷新)”的功能 先到官网(http://plugins.jquery.com/cookie/ )下载coo ...

  8. 借助 Java 9 Jigsaw,如何在 60 秒内创建 JavaFX HelloWorld 程序?

    [编者按]本文作者为 Carl Dea,主要介绍利用 Jigsaw 项目在大约一分钟内编写标准化的"Hello World"消息代码.本文系国内 ITOM 管理平台 OneAPM ...

  9. iOS防止button重复点击

    项目中常会遇到在按钮的点击事件中去执行一些耗时操作.如果处理不当经常会出现连续多次点击push多次的情况,造成不好的用户体验. 一种情况是用户快速连续点击,这种情况无法避免.另一种情况是点击一次后响应 ...

随机推荐

  1. HDU 2094 产生冠军(STL map)

    产生冠军 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submis ...

  2. hbase的读写过程

    hbase的读写过程: hbase的架构: Hbase真实数据hbase真实数据存储在hdfs上,通过配置文件的hbase.rootdir属性可知,文件在/user/hbase/下hdfs dfs - ...

  3. nodejs版本控制:nvm use命令失效

    Downloading npm version ... Download failed. Rolling Back. Rollback failed. remove C:\Users\Administ ...

  4. Anaconda配置环境变量+创建虚拟环境+pycharm使用虚拟环境

    Anaconda配置环境变量+创建虚拟环境 配置环境变量 没有添加系统变量,所有系统根本识别不了conda命令,找不到位置,所以添加以下系统变量: 添加对应Anaconda环境变量:(以自己的安装路径 ...

  5. 关于mysql varchar(N)

    varchar(N) 能存多少个中文字符? 4.0版本以下,varchar(50),指的是50字节,如果存放UTF8汉字时,只能存16个(每个中文3字节) gbk :每个字符最多占用2个字节 utf8 ...

  6. Centos7安装Python3的方法[转]

    Centos7安装Python3的方法   由于centos7原本就安装了Python2,而且这个Python2不能被删除,因为有很多系统命令,比如yum都要用到. [root@VM_105_217_ ...

  7. Django的MTV模型

    MTV模型 Django框架的设计模式借鉴了MVC框架的思想,也是分成三部分,来降低各个部分之间的耦合性. MTV框架是Django的框架,三部分为: Model Template(模板) View ...

  8. matlab读取内容为二进制的TXT文件

    本方法同样适合读取十六进制和二进制以外的其他进制文件,txt使用一个最简单的命令就可以读取 textread 这是一个十分有用,简便的函数(对于fopen fscanf而言)读取二进制txt文件:假如 ...

  9. Librepilot-创建UAVObject及编译到飞机端和地面站端的步骤

    1. 创建UAVObject描述文件(xx.xml),并存放到\librepilot\shared\uavobjectdefinition目录中:2. 在\librepilot\flight\targ ...

  10. 023-zabbix性能优化中的几个中肯建议

    随着zabbix的广泛应用,少数人的zabbix服务器在性能上出现瓶颈,或者在未来会出现性能方面的瓶颈,接下来讨论几个有效并且简单的优化方案. 服务器硬件 想通过几个简单的配置让服务器提高成倍的性能, ...