js实现短信验证码倒计时性能
发布时间：2022-04-20 09:38:57 所属栏目：语言 来源：互联网
导读：现在很多网站很软件都添加了短信验证的功能，我们在使用时发现一般获取一次验证码之后，需要等待一段时间才能获取下一次验证码，那么发送短信验证间隔是如何实现呢？这篇文章就主要介绍使用js实现短信验证码倒计时功能。 代码如下 !DOCTYPE html html lang=e
|
现在很多网站很软件都添加了短信验证的功能，我们在使用时发现一般获取一次验证码之后，需要等待一段时间才能获取下一次验证码，那么发送短信验证间隔是如何实现呢？这篇文章就主要介绍使用js实现短信验证码倒计时功能。 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> 手机号码：<input type="text"><button>发送验证码</button> <script> var btn=document.querySelector('button') var time=3 btn.addEventListener('click',function () { btn.disabled=true var timer=setInterval(function () { if (time<0){ clearInterval(timer) 代码解释 这里因为我们只改变按钮的样式和功能，所以只获取了按钮，然后设置一个time变量，这是倒计时的时间。然后设置点击事件，当我们点击这个按钮过后让这个按钮的disable变为true，意思是不能够点击。 然后设置定时器，判断如果倒计时小于0，那么清除定时器，倒计时结束，让按钮变为可点击，里面的1文字变为发送验证码，接着重新给倒计时赋值为3. 如果倒计时大于0，把按钮里面的文字改为'还剩' + time + ‘秒'，time-，每循环一次都判断一次 以上就是关于js短信验证码的介绍，为了防止被恶意获取短信验证码信息，设置短信发送间隔间隔是有必要的。更多js短信验证码内容大家能关注其他文章。 （编辑：济南站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
