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

1.效果如下:

 
 
2.代码如下:
 
<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 = 0;
var tipId;
var tipO;
function show() {
nn = 10;
tipId = window.setInterval("start()", 1000); //每隔1秒调用一次start()方法
$("#btn").removeAttr("onclick");//取消点击事件
tipO = window.setTimeout("getclick()", 10000);//10秒后给定点击事件
} function start() {
if (nn > 0) {
var vv = " 点下我不会怀孕的 (" + nn + ")";
$("#btn").attr("disabled", "disabled"); //使按钮不能被点击
$("#btn").attr("value", vv); //更改按钮上的文字
nn--;
} else {
$("#btn").removeAttr("disabled"); //使按钮能够被点击
$("#btn").attr("value", " 点下我不会怀孕的 "); //更改按钮上的文字
window.clearInterval(tipId); //清除循环事件
}
} function getclick() {
$("#btn").attr("onclick", "show()"); //给定点击事件
window.clearTimeout(tipO);//取消定时事件
}
</script>

【Javascript Demo】防止按钮在短时间内被多次点击的更多相关文章

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

    vue组件 (function(){ let openDelay=false; Vue.directive('intervalclick', function(el,binding){ el.oncl ...

  2. 点击按钮文字变成input框,点击保存变成文字

    <!DOCTYPE html><html lang="en"> <head> <meta http-equiv="Content ...

  3. 学霸笔记系列 - Python Selenium项目实战(一)—— 怎么去验证一个按钮是启用的(可点击)?

    Q: 使用 Python Selenium WebDriver 怎么去验证一个按钮是启用的(可点击)? A:Selenium WebDriver API 里面给出了解决方法is_enabled() 使 ...

  4. js实现点击按钮时显示弹框,点击按钮及弹框以外的区域时隐藏弹框

    转自https://blog.csdn.net/yimawujiang/article/details/86496936 问题:js实现点击按钮时显示弹框,点击按钮及弹框以外的区域时隐藏弹框? 方案一 ...

  5. 使用ajax登录验证,第一次点击登录按钮无反应,第二次点击才能正常运行。

    问题描述: 使用ajax进行登录验证时,第一次点击登录按钮无反应,第二次点击才能进去. 解决方法: 原来的代码 <form action="" method="po ...

  6. 【JavaScript Demo】回到顶部功能实现

    随着网站的不断发展,需要展示的内容也越来越丰富,这导致网页上能展示的内容越来越多.当内容堆积影响了用户体验,就需考虑如何提升用户体验.在这一系列的改动中,“回到顶部”的功能成为了一个经典. 1.页面布 ...

  7. OAF 使用 javascript 使某个按钮在5秒内不能重复点击

    首先要保证按钮是BUTTON,并且按钮事件设置firePartialAction. public class CuxXXXXPGCO extends OAControllerImpl { public ...

  8. JavaScript显示分页按钮

    /** * 获取分页按钮 * @param total_page 总页数 * @param current_page 当前页 * @param num 每页显示多少个分页按钮 * @returns { ...

  9. Javascript之简单按钮搜索功能

    学习JavaScript我觉得真实的感觉就是可以任意设计,“没有做不到只有想不到!”即使简单,但是任何东西的复杂都是从简单.基础开始的!这是我自己做的一个超简单的"搜索引擎"按钮, ...

随机推荐

  1. 【推导】The 16th UESTC Programming Contest Preliminary L - Foxtrot

    题意:有n瓶药剂,其中只有一瓶药剂有毒.让你用最少的小白鼠试出哪瓶有毒.你只有一次给任意只小白鼠各喂食任意种类药剂的机会. m只老鼠就能对应2^m种“生死状态”的组合,给每种状态分配一个种类的药剂,然 ...

  2. 浅谈 PHP 中的多种加密技术及代码示例

    信息加密技术的分类 单项散列加密技术(不可逆的加密) 属于摘要算法,不是一种加密算法,作用是把任意长的输入字符串变化成固定长的输出串的一种函数 MD5 string md5 ( string $str ...

  3. bzoj 1563

    对于很多决策单调性DP问题,我们很难(但不是不可以)证明其决策满足单调性,所以感觉很像时,可以打表看是否满足. 这道题的精度(?范围)很难搞,开始生怕溢出,看了hzwer的代码,才发现用long do ...

  4. python开发_tkinter_菜单的不同选项

    python的tkinter模块中,菜单也可以由你自定义你的风格 下面是我做的demo 运行效果: ====================================== 代码部分: ===== ...

  5. SQL 死锁进程查询

    use master go declare @spid int,@bl int DECLARE s_cur CURSOR FOR ,blocked ) a ) b where a.blocked=sp ...

  6. Linux终端(Xshell等)的编码设置

    先简单说说一下遇到的情况吧: 在用类似Xshell的工具连接远端Linux时,运行命令ls时,如果有中文,就会显示有乱码: 网上查资料时,也把相应的连接属性修改为utf-8了(见下图),但是还是不行: ...

  7. 一个.net下的轻量级的Serverless 文档数据库LiteDB

    今天发现了一个.net下的轻量级的Serverless 文档数据库LiteDB,感觉还不错 官方网站: http://www.litedb.org/ 项目主页: https://github.com/ ...

  8. 在WPF中使用全局快捷键

    今天写一个小程序中使用到了全局快捷键,找到了我之前写的文章在c#中使用全局快捷键翻了一下,发现它是WinForm版本的,而我现在大部分写WPF程序了,便将其翻译了为WPF版本的了. static cl ...

  9. .Net高级技术——IDisposable

    IDisposable概述 GC(垃圾收集器)只能回收托管(Managed)内存资源,对于数据库连接.文件句柄.Socket连接等这些资源(非托管资源,UnManaged)就无能为例,必须程序员自己控 ...

  10. 通过Web启动本地应用程序

    通过自定义协议在Web中启动本地应用程序 实例是打开本地安装的Word程序   注册自己的协议Windows Registry Editor Version 5.00 [HKEY_CLASSES_RO ...