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


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 相关文章推荐
讲两件事:1.this指针的用法小探. 2.ie的attachEvent和firefox的addEventListener在事件处理上的区别
Apr 12 Javascript
IE与firefox下Dhtml的一些区别小结
Dec 02 Javascript
jQuery获取选中内容及设置元素属性的方法
Jul 09 Javascript
浅谈javascript中基本包装类型
Jun 03 Javascript
jQuery轻松实现无缝轮播效果
Mar 22 jQuery
详解Angular路由 ng-route和ui-router的区别
May 22 Javascript
详解Angular4中路由Router类的跳转navigate
Jun 09 Javascript
js学习总结之dom2级事件基础知识详解
Jul 27 Javascript
vue mint-ui tabbar变组件使用
May 04 Javascript
vue 实现用户登录方式的切换功能
Apr 14 Javascript
基于ajax及jQuery实现局部刷新过程解析
Sep 12 jQuery
如何利用javascript接收json信息并进行处理
Aug 06 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
ThinkPHP3.2.1图片验证码实现方法
2016/08/19 PHP
在IIS下安装PHP扩展的方法(超简单)
2017/04/10 PHP
高性能web开发 如何加载JS,JS应该放在什么位置?
2010/05/14 Javascript
Javascript学习笔记之 对象篇(四) : for in 循环
2014/06/24 Javascript
window.location 对象所包含的属性
2014/10/10 Javascript
理解JavaScript的变量的入门教程
2015/07/07 Javascript
JS实现的另类手风琴效果网页内容切换代码
2015/09/08 Javascript
悬浮广告方法日常收集整理
2016/03/18 Javascript
浅谈jQuery animate easing的具体使用方法(推荐)
2016/06/17 Javascript
JavaScipt选取文档元素的方法(推荐)
2016/08/05 Javascript
原生js实现中奖信息无间隙滚动效果
2017/01/18 Javascript
提高Node.js性能的应用技巧分享
2017/08/10 Javascript
Angular实现的自定义模糊查询、排序及三角箭头标注功能示例
2017/12/28 Javascript
用jquery获取select标签中选中的option值及文本的示例
2018/01/25 jQuery
js正则表达式校验指定字符串的方法
2018/07/23 Javascript
[01:51]2014DOTA2西雅图邀请赛 MVP 外卡赛black场间采访
2014/07/09 DOTA
利用Python抓取行政区划码的方法
2016/11/28 Python
python跳过第一行快速读取文件内容的实例
2018/07/12 Python
调用其他python脚本文件里面的类和方法过程解析
2019/11/15 Python
keras用auc做metrics以及早停实例
2020/07/02 Python
Python 没有main函数的原因
2020/07/10 Python
详解python方法之绑定方法与非绑定方法
2020/08/17 Python
详解python对象之间的交互
2020/09/29 Python
Python Socket多线程并发原理及实现
2020/12/11 Python
Python 中如何使用 virtualenv 管理虚拟环境
2021/01/21 Python
CSS3 开发工具收集
2010/04/17 HTML / CSS
来自世界各地的优质葡萄酒:VineShop24
2018/07/09 全球购物
个人简历中的自我评价范例
2013/10/29 职场文书
家长会邀请书
2014/01/25 职场文书
服装促销活动方案
2014/02/23 职场文书
离职证明标准格式
2014/09/15 职场文书
群众路线教育实践活动思想汇报(2014特荐篇)
2014/09/16 职场文书
学习保证书怎么写
2015/02/26 职场文书
2015年社区计生工作总结
2015/04/21 职场文书
超市食品安全承诺书
2015/04/29 职场文书
TypeScript 使用 Tuple Union 声明函数重载
2022/04/07 Javascript