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

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. c# Nlog 非xml cs方法配置

    public static void InitLog(TargetWithLayout target = null, string level = "Debug", string ...

  2. Redis入门_下

    本文主要介绍redis一些高级特性. 1.Redis HyperLogLog Redis HyperLogLog 是用来做基数统计的算法,HyperLogLog 的优点是,在输入元素的数量或者体积非常 ...

  3. git使用步骤

    1报名出处: git config --global user.name lhp  用户名 git config --global user.email a@.qq.com 邮箱 2.建立项目文件夹: ...

  4. win7下通过easyBCD引导安装Ubuntu16.04（并处理遇到的坑）

    Ubuntu16.04作为目前最新版本的ubuntu系统,相信很多人都想在自己的电脑上安装一下,然而系统的安装方法各式各样,u盘法.grub引导法等等,这里我将介绍在win7系统下用easyBCD软件 ...

  5. 移动端页面点击a标签会有半透明的阴影或红色边框的bug

    好久没有更新了,今天来一发 ^_^ 最近在写移动端页面,测试时发现一个a标签的bug:无论是iOS端还是Android端都存在,当点击a标签,会有一个矩形的透明的阴影闪一下(不同的浏览器阴影的颜色还不 ...

  6. 利用vitual构造类的动态多态性

    虚函数: 在程序运行过程中调用函数名相同的函数而实现不同功能的函数 利用虚函数这一特性,我们可以在公有继承的基类(父类)中定义虚函数,而在它们的派生类(子类)中通过基类指针来实现派生类中同名函数的调用 ...

  7. GB 标准

    std::map<int, std::string> GB2261 = { { 0,"未知的性别" }, { 1,"男性" }, { 2," ...

  8. SQL2005查询死锁的表和具体的语句

    查是哪个进程死锁了哪些表 select request_session_id spid,OBJECT_NAME(resource_associated_entity_id) tableName fro ...

  9. JDBC底层原理

    Class.forName(“com.mysql.jdbc.Driver”)是 强制JVM将com.mysql.jdbc.Driver这个类加载入内存,并将其注册到DriverManager类,然后根 ...

  10. Swift 之属性setter、getter方法

    Swift 之属性setter.getter方法 Swift中的属性分为两种属性,一种就是计算型属性 一种就是存储型属性,开始我虽然知道这两种属性,但是了解并不深对于他的setter和getter方法 ...