微客导航 » 文章资讯 » JS实现发送短信验证后按钮倒计时功能(防止刷新倒计时失效)

JS实现发送短信验证后按钮倒计时功能(防止刷新倒计时失效)

2024-02-16 17:29:03 152

应用场景

在开发“发送短信验证”功能时候，要解决一个问题，防止恶意或频繁发送短信验证码问题。一般原理是“当点击发送按钮时，发送ajax请求到服务器发送短信验证码，成功则把发送按钮设置为不可点击，并且调用定时器，按钮显示倒计时”。如果就这样不对倒计时存储做处理，那么当刷新页面，会出现倒计时失效，按钮可点击。提供以下解决方案：

利用cookie存储倒计时
利用HTML5的localStorage存储倒计时

利用cookie存储倒计时

发送成功后把剩余倒计时存储到cookie，当页面刷新时，检查cookie是否还存储着剩余倒计时？，如果有，发送按钮则保持倒计时状态，不可点击，否则发送按钮可点击。

HTML代码

jQuery代码

以上所述是小编给大家介绍的JS实现发送短信验证后按钮倒计时功能(防止刷新倒计时失效)，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持！

返回顶部
3162201930
czq8825@qq.com

JS实现发送短信验证后按钮倒计时功能(防止刷新倒计时失效)

热门推荐

随机推荐