为了防止用户恶意获取短信验证码或邮箱验证，在网站制作时会考虑在点击获取验证码的按钮上做个倒计时的效果。
需要隔10秒再次发送，
实现这个功能，需要用到setInterval和clearInterval。
setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。
setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。
实例效果和代码如下：
See the Pen
获取验证码倒计时效果 by 江山如画 (@jgyzhr)
on CodePen.
125jz网原创文章。发布者：江山如画，转载请注明出处：http://www.125jz.com/4070.html
最近做网页设计项目，要求点击图片后弹出窗口，在新弹出窗口中播放视频。从网上找了很多代码，要么非常复杂，要么兼容性有问题，反复对比多种实现方法，最后确定代码如下： <!DOCTYPE html> <html> <head> <meta charset=”UTF-8″/> <title>JS+CSS实现…
<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;…
一个精美的滑出式水平导航特效，打开页面只能看到文本链接，用户将鼠标悬停于标签上时，该导航菜单项目会滑出。 预览 下载源码 1、HTML结构 导航实现仅用一个简单的无序列表 <ul id=”navigation”> <li class=”home”><a href=””><span>Home</sp…
在<head></head>之间引入 <link rel=”stylesheet” type=”text/css” href=”css/font-awesome.css”> <link rel=”stylesheet” href=”css/style.css”> 在<body></body&g…
非常简洁的一个三级导航菜单，纯css实现，适用于企业产品分类导航等，代码精简，兼容所有浏览器。 See the Pen 纯css实现的三级下拉导航菜单 by 江山如画 (@jgyzhr)on CodePen.
微信扫一扫 
支付宝扫一扫 