防止按钮在短时间内被多次点击的方法


Posted in Javascript onMarch 10, 2014

如果一个按钮可以在短时间内多次点击,那么有可能会被用户恶意点击,为防止这种情况,可以设定一定时间内只能点击一次,其他时间禁止点击按钮。

代码如下:

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title>Js定时事件</title> 
<script src="js/jquery-1.9.1.js" type="text/javascript"></script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<input type="button" value="点下我" id="btn" onclick="show()" /> 
</div> 
<script type="text/javascript"> 
/* 
timeId=window.setTimeout("method()",1000); window.clearTimeout(timeId);定时执行 
timeId=window.setInterval("method()",1000); window.clearInterval(timeId);循环执行 
*/ var nn = 30; 
var tipId; 
function show() { 
tipId = window.setInterval("start()", 1000); //每隔1秒调用一次start()方法 
} 
function start() { 
if (nn > 0) { 
var vv = "点下我(" + nn + ")"; 
$("#btn").attr("disabled", "disabled"); //使按钮不能被点击 
$("#btn").attr("value", vv); //更改按钮上的文字 
nn--; 
} else { 
nn = 30; 
$("#btn").removeAttr("disabled"); //使按钮能够被点击 
$("#btn").attr("value", "点下我"); //更改按钮上的文字 
window.clearInterval(tipId); //清除循环事件 
} 
} 
</script> 
</form> 
</body> 
</html>
Javascript 相关文章推荐
jQuery弹出层插件简化版代码下载
Oct 16 Javascript
js表数据排序 sort table data
Feb 18 Javascript
js页面跳转的常用方法整理
Oct 18 Javascript
JS实现多物体缓冲运动实例代码
Nov 29 Javascript
使用原生的javascript来实现轮播图
Feb 24 Javascript
jquery处理checkbox(复选框)是否被选中实例代码
Jun 12 jQuery
详解使用React全家桶搭建一个后台管理系统
Nov 04 Javascript
详解webpack提取第三方库的正确姿势
Dec 22 Javascript
vue-cli 项目打包完成后运行文件路径报错问题
Jul 19 Javascript
django简单的前后端分离的数据传输实例 axios
May 18 Javascript
解决vuex刷新数据消失问题
Nov 12 Javascript
如何在现代JavaScript中编写异步任务
Jan 31 Javascript
JS操作CSS随机改变网页背景实现思路
Mar 10 #Javascript
jquery插件开发之实现jquery手风琴功能分享
Mar 10 #Javascript
文本域光标操作的jQuery扩展分享
Mar 10 #Javascript
jquery插件开发之实现google+圈子选择功能
Mar 10 #Javascript
js实现通用的微信分享组件示例
Mar 10 #Javascript
jquery基础教程之数组使用详解
Mar 10 #Javascript
查询json的数据结构的8种方式简介
Mar 10 #Javascript
You might like
php下一个阿拉伯数字转中文数字的函数
2007/07/16 PHP
php面向对象全攻略 (二) 实例化对象 使用对象成员
2009/09/30 PHP
PHP常用特殊运算符号和函数总结(php新手入门必看)
2013/02/02 PHP
深入PHP中慎用双等于(==)的详解
2013/06/06 PHP
Yii中表单用法实例详解
2016/01/05 PHP
浅谈PHP中的
2016/04/23 PHP
PHP正则之正向预查与反向预查讲解与实例
2020/04/06 PHP
用javascript添加控件自定义属性解析
2013/11/25 Javascript
利用JS判断用户是否上网(连接网络)
2013/12/23 Javascript
Vue异步组件使用详解
2017/04/08 Javascript
js实现省市级联效果分享
2017/08/10 Javascript
JavaScript编写的网页小游戏,很给力
2017/08/18 Javascript
vue组件父子间通信详解(三)
2017/11/07 Javascript
微信小程序实现action-sheet弹出底部菜单功能【附源码下载】
2017/12/09 Javascript
nodejs实现OAuth2.0授权服务认证
2017/12/27 NodeJs
NodeJs实现简易WEB上传下载服务器
2019/08/10 NodeJs
在Vue中使用this.$store或者是$route一直报错的解决
2019/11/08 Javascript
[02:16]深扒TI7聊天轮盘语音出处2
2017/05/11 DOTA
详解python脚本自动生成需要文件实例代码
2017/02/04 Python
网红编程语言Python将纳入高考你怎么看?
2018/06/07 Python
python打印9宫格、25宫格等奇数格 满足横竖斜相加和相等
2019/07/19 Python
Python logging设置和logger解析
2019/08/28 Python
Python爬虫实现vip电影下载的示例代码
2020/04/20 Python
python中str内置函数用法总结
2020/12/27 Python
Python列表的深复制和浅复制示例详解
2021/02/12 Python
浅析CSS3 中的 transition,transform,translate之间区别和作用
2020/03/26 HTML / CSS
canvas实现图片镜像翻转的2种方式
2020/07/22 HTML / CSS
澳大利亚先进的皮肤和激光诊所购物网站:Soho Skincare
2018/10/15 全球购物
Expedia瑞典官网:预订度假屋、酒店、汽车租赁、机票等
2021/01/23 全球购物
班级德育工作实施方案
2014/02/21 职场文书
乡镇党员干部群众路线对照检查材料思想汇报
2014/09/28 职场文书
酒店工程部岗位职责
2015/02/12 职场文书
2015年志愿者服务工作总结
2015/04/20 职场文书
安全守法证明
2015/06/23 职场文书
红灯733-1型14管5波段半导体收音机
2021/04/22 无线电
在 Python 中利用 Pool 进行多线程
2022/04/24 Python