<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script type="text/javascript" src="js/jquery.js"></script>

</head> 

<body>

<input type="button" id="btn" value="免费获取验证码" onclick="settime(this)" />

<script type="text/javascript">

var countdown=60;

function settime(val) {

if (countdown == 0) {

val.removeAttribute("disabled");

val.value="免费获取验证码";

countdown = 60;

} else {

val.setAttribute("disabled", true);

val.value="重新发送(" + countdown + ")";

countdown--;

}

setTimeout(function() {

settime(val)

},1000)

}

</script>

</body>

</html>
java技术交流群 57388149

点击按钮出现60秒倒计时js代码的更多相关文章

  1. 点击按钮出现60秒倒计时，JS（按钮）

    <script type="text/javascript"> var countdown=60; function settime(val) { var e = $( ...

  2. 获取验证码，60秒倒计时js

    <input type="button" id="btn" value="免费获取验证码" /><script type= ...

  3. js实现60秒倒计时效果（使用了jQuery）

    今天碰到要实现一个类似那种短信验证码60秒倒计时的需求,好久不写js,有点手生.把代码记录下,方便后续查阅. 这里我用了jQuey,毕竟写起来简洁点.下面直接看效果和代码. 一.效果          ...

  4. js实现倒计时60秒的简单代码

    <!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Conten ...

  5. 微信小程序60秒倒计时

    微信小程序发送短信验证码后60秒倒计时功能,效果图: 完整代码 index.wxml <!--index.wxml--> <view class="container&qu ...

  6. vue实现验证码倒计时60秒的具体代码

    vue实现验证码倒计时60秒的具体代码 <span v-show="show" @click="getCode">获取验证码</span> ...

  7. uni验证码60秒倒计时

    其实要实现这个功能原理非常简单,就是setInterval+setTimeout+clearInterval结合使用,首先在data里定义一个变量second,初始值为60,然后在setInterva ...

  8. 页面点击按钮下载excel（原生js)

    let els = document.getElementsByTagName('iframe'); if(els.length > 0){ for(let i = 0;i < els.l ...

  9. js jquery 按钮点击后 60秒之后才能点击 60秒倒计时

    var wait = 60; function time(o) { if (wait == 0) { $(o).attr("disabled", false); $(o).val( ...

随机推荐

  1. 点击验证码刷新（tp3.1）--超简单

    省略js点击刷新验证码,虽然看不懂 <img src='http://localhost/app/index.php/Index/verify/'  onclick='this.src=this ...

  2. UI第二节——UIButton详解

    - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launc ...

  3. 自定义C/C++头文件以及头文件重复定义解决

    今天再看二叉树的知识,看着看着就看到C/C++的头文件及头文件重复定义这一块去了.以前就看到过这个问题,但是自己一直没有用到这方面的东西,今天遇到就顺便总结一下,等以后忘了再回来看看. 首先明确一点C ...

  4. css3延时动画

    不太理解属性都是什么意思,但是有动画效果,我也是惊呆了 <style> #animated_div{animation:animated_div 4s 1; -moz-animation: ...

  5. 跟着百度学PHP[4]OOP面对对象编程-10-静态关键字static

    使用static关键字可以将类中的成员标识为静态的,既可以用来标识成员属性,也可以用来标识成员方法. 以Person类为例,如果在person类中有一个“$country=’china’”的成员属性, ...

  6. hiho一下 第一百零七周 Give My Text Back（微软笔试题）

    题目1 : Give My Text Back 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 To prepare for the English exam Littl ...

  7. c++ 字符串流 sstream（常用于格式转换） 【转载】

    使用stringstream对象简化类型转换C++标准库中的<sstream>提供了比ANSI C的<stdio.h>更高级的一些功能,即单纯性.类型安全和可扩展性.在本文中, ...

  8. 39 网络相关函数(七)——live555源码阅读(四)网络

    39 网络相关函数(七)——live555源码阅读(四)网络 39 网络相关函数(七)——live555源码阅读(四)网络 简介 14)readSocket从套接口读取数据 recv/recvfrom ...

  9. hadoop小试

    standard mode(标准模式) 下载 wget http://mirror.bit.edu.cn/apache/hadoop/common/stable/hadoop-2.7.2.tar.gz ...

  10. ubuntu彻底卸载mysql

    1.删除mysql sudo apt-get autoremove --purge mysql-server-5.0 sudo apt-get remove mysql-server sudo apt ...