当前位置： 移动技术网 > IT编程>开发语言>JavaScript > 基于vue实现图片验证码倒计时60s功能

基于vue实现图片验证码倒计时60s功能

2020年03月09日  | 移动技术网IT编程  | 我要评论

1.基于vue实现图片验证码

html:

   <div class="formitem pr">
       <img src="../../image/icon2.png" alt="">
       <input type="text" placeholder="请输入验证码">
       <img :src="identifyingcode" alt="图文验证码" class="identifyingcode" @click="updateidentifyingcode(true)">
     </div>

js:

2.vue实现验证码倒计时60s

html:

 <div class="formitem">
      <img src="../../image/icon2.png" alt="">
      <input type="text" placeholder="请输入验证码">
      <button class="button" type="button" name="button" @click="sendcode()" v-show="show">获取验证码</button>
      <button class="button codebtn" type="button" name="button" v-show="!show">{{sum}}s</button>
   </div>

js:

效果图：

总结

以上所述是小编给大家介绍的基于vue实现图片验证码倒计时60s功能，希望对大家有所帮助

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网