前端防止button被多次点击
前端的部分逻辑有时候控制前端的显示。比方记录收藏数目等等。有时候多次反复点击会造成前端显示的bug。所以须要有部分逻辑推断去筛除掉反复多次的点击。
实现部分代码例如以下,主要是通过setTimeout去加以推断。即不管点击几次,间隔一定时间才会去触发一次事件。从而仅仅产生一次的记录:
<script>
var i=0; //推断点击次数寄存
var closetimer = null; //延时函数寄存 function Button1_Click() //botton点击事件
{
console.log('1');
i++; //记录点击次数
closetimer = window.setTimeout(setout,200); }
function setout(){ //点击运行事件
if(i>1) //假设点击次数超过1
{
console.log('wrong');
window.clearTimeout(closetimer); //清除延时函数
closetimer = null; //设置延时寄存为null
//加入操作代码
i=0; //重置点击次数为0
}
else{ //假设点击次数为1
console.log('right');
i=0; //重置点击次数为0
//加入运行操作的代码
}
}
</script>
前端防止button被多次点击的更多相关文章
- js进阶 12-15 jquery如何实现点击button显示列表,点击其它位置隐藏列表
js进阶 12-15 jquery如何实现点击button显示列表,点击其它位置隐藏列表 一.总结 一句话总结:在button中阻止事件冒泡. 1.如何咋button中阻止事件冒泡(两种方法)? ev ...
- ListView中嵌入布局的Button或多个点击事件
有时候在ListView嵌入的布局中有多个事件需要点击,比如一个item中有TextView和Button两个布局,当我们需要获取这两个点击事件时,我们应该如何去获取呢,通常来说,我们都是已经固定好了 ...
- 从头开始一步一步实现EF6+Autofac+MVC5+Bootstarp极简前后台ajax表格展示及分页(二)前端修改、添加表格行点击弹出模态框
在前一篇中,由于不懂jquery,前端做的太差了,今天做稍做修改,增加一个跳转到指定页面功能,表格行点击样式变化.并且在表格中加入bootstarp的按钮组,按钮点击后弹出模态框,须修改common, ...
- iOS 在tableView上添加button导致按钮没有点击效果和不能滑动的 zhuang
转载请注明出处. 今天在调试代码的时候,在tableviewcell上添加button,发现button快速点击的话,是看不出点击效果的,查找资料发现, ios7上UITableViewCell子层容 ...
- 【转】Android - Button(按钮)的响应点击事件的4种写法
原文网址:http://www.yrom.net/blog/2011/12/12/android-4-onclicklistener-of-button/ Button控件setOnclickList ...
- Button的五种点击事件
1.内部类方式 class MyOnClickListener implements View.OnClickListener{ /** * Called when a view has been c ...
- Button控件的点击事件
Java的代码 主要重点: findViewById(); OnClickListener() package com.example.admin.myapplication; import andr ...
- Unity3D NGUI 二 NGUI Button怎样接受用户点击并调用函数,具体方法名称是什么
a.直接监听事件 把下面脚本直接绑定在按钮上,当按钮点击时就可以监听到,这种方法不太好很不灵活. void OnClick(){ Debug.Log("Button is Click!!!& ...
- Android - Button(按钮)的响应点击事件的4种写法
Button控件setOnclickListener(View.OnClickListener listener)来接收一个点击事件的监听器 自定义一个点击事件监听器类让其实现View.OnClick ...
随机推荐
- ShareREC for iOS v1.0.4 已经公布
ShareREC for iOS v1.0.4 已经公布 版本号:v1.0.4 2015-3-13 1.新增视频列表的筛选排序功能 2.修复在開始录制后,没有调用结束录制直接进入社区崩溃问题 3.优化 ...
- ChrisRenke/DrawerArrowDrawable源代码解析
转载请注明出处http://blog.csdn.net/crazy__chen/article/details/46334843 源代码下载地址http://download.csdn.net/det ...
- HDU 1160 FatMouse's Speed DP题解
本题就先排序老鼠的重量,然后查找老鼠的速度的最长递增子序列,只是由于须要按原来的标号输出,故此须要使用struct把三个信息打包起来. 查找最长递增子序列使用动态规划法.主要的一维动态规划法了. 记录 ...
- Linux以下基于TCP多线程聊天室(client)
不怎么会弄这个博客的排版,就直接将代码附上: 主要是使用多线程去等待接受数据和发送数据.以下是client的代码: tcpsed.h文件 1 2 3 4 5 6 7 8 9 10 11 12 13 1 ...
- 多线程编程TSL相关的技术文档
线程本地存储 (TLS) https://msdn.microsoft.com/zh-cn/library/6yh4a9k1(v=vs.80).aspx Using Thread Local Stor ...
- Foundation框架经常使用数据类型和NSAutoreleasePool自己主动释放池解析
第一.NSAutoreleasePool自己主动释放池解析 1.自己主动释放池的物理实现 自己主动释放池用栈来实现.当你创建一个新的自己主动释放池是,会压栈到栈顶.接受autorelease消息的对象 ...
- 杂项-DB:DW/DWH(数据仓库)
ylbtech-杂项-DB:DW/DWH(数据仓库) 数据仓库,英文名称为Data Warehouse,可简写为DW或DWH.数据仓库,是为企业所有级别的决策制定过程,提供所有类型数据支持的战略集合. ...
- 50个极好的bootstrap 后台框架主题下载
50个极好的bootstrap 后台框架主题下载 http://sudasuta.com/bootstrap-admin-templates.html 越来越多的设计师和前端工程师开始用bootstr ...
- python中数字的排序
lst = [2,22,4,7,18]for j in range(len(lst)): #记录内部排序的次数 i = 0 while i < len(lst)-1: if lst[i] > ...
- Python 函数(一)
定义一个函数 函数的第一行语句可以选择性地使用文档字符串—用于存放函数说明. 函数内容以冒号起始,并且缩进. return [表达式] 结束函数,选择性地返回一个值给调用方.不带表达式的retur ...