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


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 相关文章推荐
20个非常有用的PHP类库 加速php开发
Jan 15 Javascript
Javascript学习笔记二 之 变量
Dec 15 Javascript
浅谈jquery回调函数callback的使用
Jan 30 Javascript
前端性能优化及技巧
May 06 Javascript
Node.js测试中的Mock文件系统详解
Nov 21 Javascript
selenium 与 chrome 进行qq登录并发邮件操作实例详解
Apr 06 Javascript
Vue通过input筛选数据
Oct 26 Javascript
JavaScript实现body内任意节点的自定义属性功能示例
Sep 18 Javascript
node.js+express+mySQL+ejs+bootstrop实现网站登录注册功能
Jan 12 Javascript
jQuery简单判断值是否存在于数组中的方法示例
Apr 17 jQuery
详解vue使用vue-layer-mobile组件实现toast,loading效果
Aug 31 Javascript
layui layer select 选择被遮挡的解决方法
Sep 21 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
windows下开发并编译PHP扩展的方法
2011/03/18 PHP
微信公众号开发之微信公共平台消息回复类实例
2014/11/14 PHP
PHP CURL 内存泄露问题解决方法
2015/02/12 PHP
举例详解PHP脚本的测试方法
2015/08/05 PHP
[原创]PHP简单开启curl的方法(测试可行)
2016/01/11 PHP
js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
2013/01/24 Javascript
js字符串转成JSON
2013/11/07 Javascript
jQuery选择器全面总结
2014/01/06 Javascript
JS生成随机字符串的多种方法
2014/06/10 Javascript
Bootstrap编写一个同时适用于PC、平板、手机的登陆页面
2016/06/30 Javascript
jquery实现(textarea)placeholder自动换行
2016/12/22 Javascript
js数字舍入误差以及解决方法(必看篇)
2017/02/28 Javascript
详解vue 模版组件的三种用法
2017/07/21 Javascript
Vue的Flux框架之Vuex状态管理器
2017/07/30 Javascript
angularJS实现不同视图同步刷新详解
2018/10/09 Javascript
vue实现密码显示与隐藏按钮的自定义组件功能
2019/04/23 Javascript
ES6学习笔记之let与const用法实例分析
2020/01/22 Javascript
python+matplotlib绘制3D条形图实例代码
2018/01/17 Python
Python中的单行、多行、中文注释方法
2018/07/19 Python
python画折线图的程序
2018/07/26 Python
解决python selenium3启动不了firefox的问题
2018/10/13 Python
win7下 python3.6 安装opencv 和 opencv-contrib-python解决 cv2.xfeatures2d.SIFT_create() 的问题
2019/10/24 Python
opencv3/Python 稠密光流calcOpticalFlowFarneback详解
2019/12/11 Python
win10系统下python3安装及pip换源和使用教程
2020/01/06 Python
win10安装tesserocr配置 Python使用tesserocr识别字母数字验证码
2020/01/16 Python
基于opencv实现简单画板功能
2020/08/02 Python
临床护士自荐信
2014/01/31 职场文书
给全校老师的建议书
2014/03/13 职场文书
合伙开公司协议书范本
2014/10/28 职场文书
个人事迹材料怎么写
2014/12/30 职场文书
学校重阳节活动总结
2015/03/24 职场文书
小学体育跳绳课教学反思
2016/02/16 职场文书
微信小程序和php的登录实现
2021/04/01 PHP
如何在pycharm中快捷安装pip命令(如pygame)
2021/05/31 Python
Java中使用Filter过滤器的方法
2021/06/28 Java/Android
使用Python拟合函数曲线
2022/04/14 Python