使用定时器限制点击按钮发送短信(附源码)--JavaScript小案例
不说多哈,有注释哦,直接贴代码了哈,有疑问请追评呢……
1、禁用按钮:
this.disabled = "disabled"(this指按钮)或:
this.disabled = true;

2、this代表的含义
this:事件的调用者或函数的使用者
3、程序代码
demo.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type="text"/>
<button id="btn">点击发送短信</button>
</body>
<script>
var btm = document.getElementById("btn");
var count =10;
var timer = null;//不要用timer = 0,定时器和数字没有关系
btn.onclick =function () {
clearInterval(timer);
this.disabled = "disabled";//this.disabled = true或者按钮不可以用,函数事件的调用者,也就是btn
var _this=this;//也可以这样写var that=this;
timer = window.setInterval(sendTextMessage,1000);//开启定时器
function sendTextMessage() {
count--;
if(count >=0) {
_this.innerHTML = "还剩" + count + "秒";// 如果用this.innerHTML = "还剩10s",this在这里指向定时器,一般用this,用btn的话,按钮多了就出问题了
//button是双标签,双标签用innerHTML,单标签用value
}else{
_this.innerHTML = "重新发送短信";
_this.disabled = false;
clearInterval(timer);//clearInterval(定时器名称)
count = 10;
}
}
}
//this:事件的调用者或函数的使用者
</script>
</html>
Effect Picture:

源码文件下载:使用定时器限制点击按钮发送短信.zip
使用定时器限制点击按钮发送短信(附源码)--JavaScript小案例的更多相关文章
- Android抢先截获短信(附源码)
之前在写通讯录应用时,将整体的代码写完后,自测时发现非常非常多的问题,其中一个非常重要严重的就是可以发出短信,但收不到任何的短信息,这搞的我好捉鸡啊!后来调试发现是由于没有收到短信的消息导致的,然后将 ...
- 短信平台软件开发,短信发送平台销售,短信软件源码,G客短信发送平台
一:web短信平台组成 需要短信软件平台源码的联系QQ:290615413 vx:290615413 整套短信系统平台还是由B/S(客户端+后台,取消了以前C/S的管理后台) ,C/S发送服务端和 ...
- 网页短信平台源码和开发功能介绍 思路和功能 G客短信平台
G客短信源码介绍 (只介绍现有功能模块文字介绍配系统截图) 一:后台首页 QQ:290615413 VX:290615413
- 完整的Android手机短信验证源码
短信验证功能我分两个模块来说,短信验证码的后台和代码实现短信验证码的功能. 一.短信验证码的后台 1.注册Mob账号:http://www.mob.com/#/login 2.注册成功之后, ...
- 【mob】Android短信验证+源码
在很多的应用当中,都涉及到了短信验证的功能,比如在注册或者找回密码的时候,那么我们如何通过第三方的平台来完成这个功能呢? 本面博文就实现短信验证,来做一个小的栗子. 第一步-下载开发包 第二步-将SD ...
- Android-看操作系统短信应用源码-隐式意图激活短信界面
选择模拟器Unknown Google Nexus,在选择system_process(系统进程) 操作模拟器的,操作系统短信应用,让操作系统短信打印日志,来查看: 然后就找到来,操作系统短信应用打印 ...
- a标签的妙用-拨打电话、发送短信、发送邮件
前端时间在做手机WAP网站时,遇到需要点击页面上显示的电话号能直接拨号的需求,查找资料发现可以使用html的a标签完美实现该需求!记录下来以备后用...... 目前主流手机浏览器对H5的支持已经很不错 ...
- Android中使用Intent的Action和Data属性实现点击按钮跳转到拨打电话和发送短信
场景 点击拨打电话按钮,跳转到拨打电话页面 点击发送短信按钮,跳转到发送短信页面 注: 博客: https://blog.csdn.net/badao_liumang_qizhi 关注公众号 霸道的程 ...
- WPF MVVM下做发送短信小按钮
最近做一个项目,因为涉及到注册,因此需要发送短信,一般发送短信都有一个倒计时的小按钮,因此,就做了一个,在此做个记录. 一.发送消息 没有调用公司的短信平台,只是模拟前台生成一串数字,将此串数字输出一 ...
随机推荐
- 用 k8s 运行一次性任务 - 每天5分钟玩转 Docker 容器技术(132)
容器按照持续运行的时间可分为两类:服务类容器和工作类容器. 服务类容器通常持续提供服务,需要一直运行,比如 http server,daemon 等.工作类容器则是一次性任务,比如批处理程序,完成后容 ...
- qt中的udp编程
UDP QUdpSocket ---> upd socket 1.创建 QUdpSocket *p = new QUdpSocket(); 2.最先接收数据一方 调用bind-> ip/p ...
- .net 远程调试
1.我们在调试支付接口的时候很多情况下需要请求网关等,这时候需要在服务器上进行调试 首先找到服务器上的msvsmon文件,打开运行,得到对应的端口 然后打开vs,附加进程到远程地址加上端口,然后附加w ...
- JavaScript使用点滴
JavaScript使用点滴 一.字符串替换的小插曲 遇到一个小插曲,想要把后台返回的字符串输出给前端视图,字符串中包含\n换行,需要使用javascript对其进行替换成<br />. ...
- ps色彩范围抠章
1.在photoshop打开需要抠公章的图像文件2.使用椭圆形选区工具,ALT+SHIFT+鼠标左键,选择章的范围 2.CTRL+J,复制图层,得到图层1,隐藏背景 3.CTRL+L,调整色阶,拖动两 ...
- yml 文件操作方法
文件读取方法示例: import yaml fr = open('yml_file_address', 'r',encoding='utf-8') data = yaml.load(fr) print ...
- JAVA受检异常和非受检异常举例
受检异常和非受检异常(运行时异常)举例 RuntimeException(即非受检异常): RuntimeException在默认情况下会得到自动处理,所以通常用不着捕获RuntimeExceptio ...
- PHP结合Redis来限制用户或者IP某个时间段内访问的次数
$redis = new Redis(); $redis->connect('127.0.0.1', 6379); //获取客户端真实ip地址 function get_real_ip(){ s ...
- nginx笔记4-负载均衡带来的问题以及解决办法
接着笔记3,将笔记三的改造一下,现在分别启动两个Tomcat,在页面获取session.如图所示: tomcat2的session: tomcat1的session: 根据上图发现,每个tomcat取 ...
- 流处理与消息队列------《Designing Data-Intensive Applications》读书笔记16
上一篇聊了聊批处理的缺点,对于无界数据来说,流处理会是更好的选择,"流"指的是随着时间的推移逐步增加的数据.消息队列可以将这些流组织起来,快速的在应用程序中给予反馈.但是消息队列与 ...