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


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 要点归纳(三) jQuery中的事件和动画(上:事件篇)
Mar 24 Javascript
js生成随机数之random函数随机示例
Dec 20 Javascript
js登录弹出层特效
Mar 07 Javascript
图片放大镜jquery.jqzoom.js使用实例附放大镜图标
Jun 19 Javascript
javascript轻量级模板引擎juicer使用指南
Jun 22 Javascript
Google 地图叠加层实例讲解
Aug 06 Javascript
使用JavaScript获取Request中参数的值方法
Sep 27 Javascript
Node调用Java的示例代码
Sep 20 Javascript
js实现关闭网页出现是否离开提示
Dec 07 Javascript
layui加载表格,绑定新增,编辑删除,查看按钮事件的例子
Sep 06 Javascript
如何实现js拖拽效果及原理解析
May 08 Javascript
解决Echarts2竖直datazoom滑动后显示数据不全的问题
Jul 20 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小教程之实现双向链表
2014/06/12 PHP
PHP通过get方法获得form表单数据方法总结
2018/09/12 PHP
Yii 框架使用数据库(databases)的方法示例
2020/05/19 PHP
javascript setTimeout()传递函数参数(包括传递对象参数)
2010/04/07 Javascript
两种常用的javascript数组去重方法思路及代码
2013/03/26 Javascript
jquery cookie的用法总结
2013/11/18 Javascript
raphael.js绘制中国地图 地图绘制方法
2014/02/12 Javascript
Javascript中Array.prototype.map()详解
2014/10/22 Javascript
纯js实现仿QQ邮箱弹出确认框
2015/04/29 Javascript
JavaScript html5 canvas绘制时钟效果(二)
2016/03/27 Javascript
jquery事件与绑定事件
2017/03/16 Javascript
JavaWeb表单及时验证功能在输入后立即验证(含用户类型,性别,爱好...的验证)
2017/06/09 Javascript
jfinal与bootstrap的登出实战详解
2017/11/27 Javascript
微信小程序开发之路由切换页面重定向问题
2018/09/18 Javascript
django自定义Field实现一个字段存储以逗号分隔的字符串
2014/04/27 Python
Python的Flask站点中集成xhEditor文本编辑器的教程
2016/06/13 Python
Python 基础之字符串string详解及实例
2017/04/01 Python
详解关于Django中ORM数据库迁移的配置
2018/10/08 Python
详解python持久化文件读写
2019/04/06 Python
Python3中的bytes和str类型详解
2019/05/02 Python
解决Python3用PIL的ImageFont输出中文乱码的问题
2019/08/22 Python
django列表筛选功能的实现代码
2020/03/27 Python
如何用python处理excel表格
2020/06/09 Python
Django限制API访问频率常用方法解析
2020/10/12 Python
python 使用三引号时容易犯的小错误
2020/10/21 Python
印度手工编织服装和家居用品商店:Fabindi
2019/10/07 全球购物
Piercing Pagoda官网:耳环、戒指、项链、手链等
2020/09/28 全球购物
字符串str除首尾字符外的其他字符按升序排列
2013/03/08 面试题
薪酬专员岗位职责
2014/02/18 职场文书
活动总结的格式
2014/05/07 职场文书
市场调查策划方案
2014/06/10 职场文书
金融专业毕业生自荐信
2014/06/26 职场文书
主持人大赛开场白
2015/05/29 职场文书
太空授课观后感
2015/06/17 职场文书
2016年小学生新年寄语
2015/08/18 职场文书
环保建议书范文
2015/09/14 职场文书