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(按钮)问题
在项目中,我们往往会遇到这样的问题:因为网络较慢的原因,用户会不耐烦的一直去点击按钮,这样导致的结果时:相关代码一遍一遍的被重复执行,如果按钮的事件是网络请求的话,这样又导致一种网络请求的循环.所以我 ...
随机推荐
- linux基础(8)-文件处理(awk 、sed、grep)
grep基本用法 格式:grep [选项] [模式] [文件] 选项: -c:只显示有多少行匹配 ,而不具体显示匹配的行 -n:在每一行前面打印该行在文件中的行数 -i:在字符串比较的时候忽略大小 ...
- HDU 汉诺塔系列
做了这一系列题,表示对汉诺塔与这一系列递推理解加深了 经典汉诺塔:1,2,...,n表示n个盘子,数字大盘子就大,n个盘子放在第1根柱子上,按照从上到下 从小到大的顺序排放,过程中每次大盘都不能放在小 ...
- 在eclipse中使用Github进行单元测试
时间分配是找资料60%,动手实践40%.因为之前一直没怎么好好学习,导致看到使用Gunit进行单元测试的时候感觉像是看到了一行符号一样不知所措,还好现在搜索引擎很强大,找资料学习中间有找到一个现成的傻 ...
- Pycharm更换pip源为国内
Python里的pip是官方自带的源,国内使用pip安装的时候十分缓慢,所以最好是更换成中国国内的源地址. 目前国内靠谱的 pip 镜像源有: 清华: https://pypi.tuna.tsingh ...
- Hadoop- Namenode经常挂掉 IPC's epoch 9 is less than the last promised epoch 10
如题出现Namenode经常挂掉 IPC's epoch 9 is less than the last promised epoch 10, 2019-01-03 05:36:14,774 INFO ...
- ajax_基础
ajax 请求过程 1.准备发送请求 2.填写请求地址和数据 3.请请求到服务器 4.等待服务器处理数据. 5.接受服务器返回信息 --------------------------------- ...
- JAVA常见函数
输入函数 : Scanner cin=new Scanner(System.in); int a=cin.nextInt(); //输入一个int数据 double dl=cin.nextDou ...
- Django 基础 路由系统
Django框架简介 MVC框架和MTV框架(了解即可) MVC,全名是Model View Controller,是软件工程中的一种软件架构模式,把软件系统分为三个基本部分:模型(Model).视图 ...
- Git_学习_09_指定某些文件不上传
一.前言 在git提交文件到远程分支时,可能有些文件我们并不想上传. 这时可以使用如下命令来将这些文件从暂存区移除 git rm --cached "文件路径" 注:git add ...
- 在ios7中使用zxing
ZXing(Github镜像地址)是一个开源的条码生成和扫描库(开源协议为Apache2.0).它不但支持众多的条码格式,而且有各种语言的实现版本,它支持的语言包括:Java, C++, C#, Ob ...