html一键短信代码,javascript发送短信验证码实现代码
本文首先分析手机发送验证码的原理,再对javascript发送短信验证码予以实现,具体思路如下:
实现点击“发送验证码”按钮后,按钮依次显示为“59秒后重试”、“58秒后重试”…直至倒计时至0秒时再恢复显示为“发送验证码”。在倒计时期间按钮为禁用状态 .
第一步、获取按钮、绑定事件、设置定时器变量和计时变量
第二步、添加定时器,每隔1秒钟计时减 1,直至当计时小于等于 0 时清除定时器,按钮恢复为“发送验证码”,否则显示为“X秒后重试”
效果图:
实现代码:
Document
window.οnlοad=function(){
var send=document.getElementById('send'),
times=60,
timer=null;
send.οnclick=function(){
// 计时开始
var that = this;
this.disabled=true;
timer = setInterval(function(){
times --;
that.value = times + "秒后重试";
if(times <= 0){
that.disabled =false;
that.value = "发送验证码";
clearInterval(timer);
times = 60;
}
//console.log(times);
},1000);
}
}
注意点:
设置按钮是否为禁用时,send.disabled=true; send.disabled=false;true和false不能加引号!true和false不能加引号!true和false不能加引号!否则值永远为真。
也可用send.setAttribute('disabled','disabled');或send.removeAttribute('disabled');
以上就是为大家分享的javascript发送短信验证码全部代码,希望对大家的学习有所帮助。
html一键短信代码,javascript发送短信验证码实现代码相关推荐
- 使用华为短信包,发送短信Result=61问题解决
使用华为短信包,发送短信出现了Result=61的返回. 网上说是有效时间失效 注释: /** * 创建一个发送短信消息,传入消息的各字段的值,并对各参数值进行判断,不符合要求则抛出异常 * 按要求把 ...
- 普歌-腾讯云短信+使用node发送短信(3种方法API、SDK)、封装工具、搭建web服务、写接口、调用接口发送短信、时效性判断、验证验证码的正确性(下)
普歌-结合腾讯云短信服务+node搭建一个简单的发送短信web小项目 涉及技术: 腾讯云服务 后端服务:node+express 前端搭建:html+js 前言:本来这篇博客应该很早就发了,中间有一些 ...
- N7100/GALAXY Note2 解决短信发件人实际发送短信时间
三星 N7100/GALAXY Note2 解决短信发件人实际发送短信时间... 解决短信发件人实际发送短信时间显示为当前时间的bug 如果别人给你发了一条短信,而你手机当前是关机状态,那么当你开机后 ...
- java调用短信接口实现发送短信
java调用短信接口实现发送短信 1.下载接口文件 2.打开java文件夹 2.1获取jar包依赖 2.2获取代码模板 3.创建项目 3.1打开eclipse软件,创建一个动态的web项目 3.2导入 ...
- Java调用阿里云短信接口,发送短信
Java调用阿里云短信接口,发送短信 1.短信服务这个很简单,只需要知道accessKeyId(AK).accessKeySecret(SK).短信签名.短信模板即可. 2.域名和产品名称是固定的,使 ...
- TP5调用阿里云短信接口实现发送短信功能
TP5调用阿里云短信接口实现发送短信功能 工作需要,对接阿里云的短信服务,借此记录一下(网站 www.lelee.top) 主要分为两个部分,一是下载官方的Demo事例,这个不需要多说,自己去下载就行 ...
- PHP代码中的情话,[php发送短信验证码代码]php发送短信验证码
业务: 手机端点击发送验证码,请求发送到php端,由php调用第三方平台(我们使用的是榛子云短信http://smsow.zhenzikj.com)的短信接口,生成验证码并发送. 在"我的应 ...
- java发送短信模板_java发送短信
java发送短信一般步骤 一.在中国网建中注册用户:本程序是通过中国网建提供的SMS短信平台实现的,该平台新用户注册可以拥有免费5条普通短信和3条彩信,足够进行尝试和体验了.中国网建注册地址:http ...
- python发送短信接口_python发送短信和发送邮件
先注册好 发短信脚本内容 #接口类型:互亿无线触发短信接口,支持发送验证码短信.订单通知短信等. #账户注册:请通过该地址开通账户http://sms.ihuyi.com/register.html ...
最新文章
- [非技术参考]C#基础:使用Thread创建线程(1)
- 2018/02/06
- 大数据平台安全标准设计
- SpringBoot+Mybatis多模块(module)项目搭建教程
- c语言链表查找的代码与题目,链表的C语言实现之单链表的查找运算_c语言
- splay/fhq-treap 问卷调查反馈—— [JSOI2008]火星人prefix(splay),Strange Queries(fhq-treap)
- 最后2天,BDTC 2019 早鸟票即将售罄,超强阵容及议题抢先曝光!
- 训练集,验证集,测试集比例
- 选择排序(C++/Java实现)
- 适合编写C语言代码的编程软件有哪些?大学生赶紧行动起来!
- 百度文库,道客巴巴等文库免积分下载
- MySQL数据分析-(13)表操作补充:索引
- 公主救骑士---地下城游戏_leetcode
- python中可迭代对象是什么意思_python中可迭代对象是什么
- 2021chrome浏览器视频加速(网盘)
- 一些电商英文缩写的解释
- 暑假实习 + 提前批 +校园招聘(更新中)
- 【毕业设计】基于Stm32的便携体测仪(心率 体温) - 单片机 嵌入式 物联网
- 以数据赋能业务,qlik为企业搭建透明绩效管理平台
- 摩拜上海涨价,已成全国最贵单车,一月运维花4亿全年亏45亿
热门文章
- LOJ 2547 「JSOI2018」防御网络——思路+环DP
- python中使用递归实现斐波那契数列
- 巡检路线排班问题matlab,基于数学建模的巡检线路排班设计
- 输电线路巡检报告模板
- 使用svn删除Xcode工程中的文件
- Java实训项目--小型书店管理系统(ssm框架)
- c语言获取天气信息示例(通过心知天气api获取)
- symbian 2nd中从屏蔽接入点选择以及创建新的接入点
- SMI BATCAM2.0 超声波相机(声学成像仪)介绍
- 想要风投被你的融资 PPT 打动吗?别忘了你其实就是在想方设法卖出自己公司的部分股权...