不说多哈，有注释哦，直接贴代码了哈，有疑问请追评呢……

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小案例的更多相关文章

  1. Android抢先截获短信(附源码)

    之前在写通讯录应用时,将整体的代码写完后,自测时发现非常非常多的问题,其中一个非常重要严重的就是可以发出短信,但收不到任何的短信息,这搞的我好捉鸡啊!后来调试发现是由于没有收到短信的消息导致的,然后将 ...

  2. 短信平台软件开发,短信发送平台销售,短信软件源码,G客短信发送平台

    一:web短信平台组成  需要短信软件平台源码的联系QQ:290615413 vx:290615413  整套短信系统平台还是由B/S(客户端+后台,取消了以前C/S的管理后台) ,C/S发送服务端和 ...

  3. 网页短信平台源码和开发功能介绍 思路和功能 G客短信平台

    G客短信源码介绍 (只介绍现有功能模块文字介绍配系统截图) 一:后台首页 ​ QQ:290615413 VX:290615413

  4. 完整的Android手机短信验证源码

    短信验证功能我分两个模块来说,短信验证码的后台和代码实现短信验证码的功能. 一.短信验证码的后台      1.注册Mob账号:http://www.mob.com/#/login 2.注册成功之后, ...

  5. 【mob】Android短信验证+源码

    在很多的应用当中,都涉及到了短信验证的功能,比如在注册或者找回密码的时候,那么我们如何通过第三方的平台来完成这个功能呢? 本面博文就实现短信验证,来做一个小的栗子. 第一步-下载开发包 第二步-将SD ...

  6. Android-看操作系统短信应用源码-隐式意图激活短信界面

    选择模拟器Unknown Google Nexus,在选择system_process(系统进程) 操作模拟器的,操作系统短信应用,让操作系统短信打印日志,来查看: 然后就找到来,操作系统短信应用打印 ...

  7. a标签的妙用-拨打电话、发送短信、发送邮件

    前端时间在做手机WAP网站时,遇到需要点击页面上显示的电话号能直接拨号的需求,查找资料发现可以使用html的a标签完美实现该需求!记录下来以备后用...... 目前主流手机浏览器对H5的支持已经很不错 ...

  8. Android中使用Intent的Action和Data属性实现点击按钮跳转到拨打电话和发送短信

    场景 点击拨打电话按钮,跳转到拨打电话页面 点击发送短信按钮,跳转到发送短信页面 注: 博客: https://blog.csdn.net/badao_liumang_qizhi 关注公众号 霸道的程 ...

  9. WPF MVVM下做发送短信小按钮

    最近做一个项目,因为涉及到注册,因此需要发送短信,一般发送短信都有一个倒计时的小按钮,因此,就做了一个,在此做个记录. 一.发送消息 没有调用公司的短信平台,只是模拟前台生成一串数字,将此串数字输出一 ...

随机推荐

  1. 四、正则表达式re模块

    什么是正则表达式 正则表达式,又称规则表达式,通常被用来检索.替换那些符合某个模式(规则)的文本. 正则表达式是对字符串操作的一种逻辑公式,就是用事先定义好的一些特定字符.及这些特定字符的组合,组成一 ...

  2. Python数据结构之三——dict（字典）

    Python版本:3.6.2  操作系统:Windows  作者:SmallWZQ 知识源于生活.Python也是如此. 提到字典,我首先想到的是数学大师--高斯. 为何想起他呢?这主要是因为高斯算法 ...

  3. WdatePicker-限制日期选择

    场景: 1. 开始时间,和结束时间最大选择今天. 2. 开始时间和结束时间的最大时间间隔为30天. jsp代码: <!-- 时间段 --> <form> <!-- 开始时 ...

  4. 关于http与https之间的区别

    年前的时候进行了一家公司的电话面试两轮,视频面试一轮(已拿到offer),过程中遇到了一个关于http与https的问题,当时回答的并不好,今天将其进行了总结和整理,望读者喜欢: 前言 谷歌在2018 ...

  5. 企业级docker仓库Harbor部署

    1.安装环境下载离线安装包地址https://github.com/vmware/harbor/releases/yum install -y dockerpip install -i https:/ ...

  6. NoSQLBooster for MongoDB的基本使用

    连接 File -> Quik Connect ( Ctrl + Shift + N ) 或 Connect -> From URI 填入 mongodb://username:passw ...

  7. DOM备忘录

    nodeName和nodeValue属性 对于element节点而言,nodeName是标签名,nodeValue是null:而对于textNode节点而言,nodeName是#Text,nodeVl ...

  8. PHP秒杀系统全方位设计（二）

    商品页面开发 静态化展示页面[效率要比动态PHP高很多,PHP程序需要解析等步骤,本身就需要很多流程,整个下来PHP的处理花的时间和资源要多] 商品状态的控制 开始前.进行中.库存不足.结束 数据逻辑 ...

  9. 让网站通过Https访问

    Prerequisites Before you begin, you should have some configuration already taken care of. We will be ...

  10. Ｃ#中ASCII码学习心得

    1.利用调用ASCIIEncoding类来实现各种转换.如简单个ACS码和int转换. ***利用(int)ASCIIEncoding类对象.GetBytes(character)[0]得到整数: p ...