为了防止用户恶意获取短信验证码或邮箱验证，在网站制作时会考虑在点击获取验证码的按钮上做个倒计时的效果。
需要隔10秒再次发送，
实现这个功能，需要用到setInterval和clearInterval。
setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。
setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。
实例效果和代码如下：
See the Pen
获取验证码倒计时效果 by 江山如画 (@jgyzhr)
on CodePen.
125jz网原创文章。发布者：江山如画，转载请注明出处：http://www.125jz.com/4070.html
在线客服是企业网站必不可少的在线交流渠道，本站分享的在网页右侧可隐藏的浮动QQ在线客服使用jquery编写，固定在网站右侧不随滚动条滚动，点击展开，再次点击收缩，蓝色风格，调用方便。 网页右侧可隐藏的浮动QQ在线客服效果 HTML代码： <div id=floatTools class=jz125> <div class=floatL>…
用户点击导航或菜单上不同的栏目，被选中的导航栏目会变换样式，出现图片或背景颜色的变化，用于标识是否是当前栏目或活动选项。 本教程使用jquery实现导航菜单当前（活动）菜单样式变化，导航菜单模式用的是背景颜色，你可以换成背景图片以符合建站需要。 当前（活动）菜单样式变化实现原理 在html代码中给首页（默认选中）加上class名cur <a href=…
今天分享一款纯CSS制作的二级导航菜单，不用JS/jquery，响应速度快。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>制作二级导航菜单(纵向)</title> <style type…
CSS+JS制作的垂直（纵向）二级导航菜单，可灵活修改。 <!doctype html> <html> <head> <meta charset="utf-8"> <title>CSS+JS制作的垂直（纵向）二级导航菜单|www.125jz.com</title> &…
<style> .itemInWorks{ width: 240px; height: 150px; border-radius:5px; font-size: 20px; font-weight: 600; color: #FFFFFF; text-align: center; line-height: 40px; background: ur…
实例名称：立体动画按钮、切换开关在线预览：https://codepen.io/chrisgannon/pen/ZaPmKp HTML代码： <div id=”app”></div> CSS代码： body { background-color:#FFFCF9; overflow: hidden; text-align:center;…
微信扫一扫 
支付宝扫一扫 