JavaScript实现点击按钮后变灰避免多次重复提交


Posted in Javascript onJuly 15, 2013

注册的时候需要发送验证激活帐号的邮件,为了避免邮件的多次重复发送,所以可以在点击了发送后,设置button要过一段时间才能继续点击。下面是一个简单的例子:

<html> 
<head> 
<title>点击获取验证码按钮后按钮变灰,倒计时一段时间后又可重复点击</title> 
</head> 
<body> 
<input type="button" id="btn" value="免费获取验证码" /> 
<script type="text/javascript"> 
var wait=60; 
function time(o) { 
if (wait == 0) { 
o.removeAttribute("disabled"); 
o.value="免费获取验证码"; 
wait = 60; 
} else { 
o.setAttribute("disabled", true); 
o.value=wait+"秒后可以重新发送"; 
wait--; 
setTimeout(function() { 
time(o) 
}, 
1000) 
} 
} 
document.getElementById("btn").onclick=function(){time(this);} 
</script> 
</body> 
</html>
Javascript 相关文章推荐
JavaScript的模块化:封装(闭包),继承(原型) 介绍
Jul 22 Javascript
使用jquery局部刷新(jquery.load)从数据库取出数据
Jan 22 Javascript
基于jquery的文字向上跑动类似跑马灯的效果
Sep 22 Javascript
JavaScript中的条件判断语句使用详解
Jun 03 Javascript
javascript封装 Cookie 应用接口
Aug 07 Javascript
js插件dropload上拉下滑加载数据实例解析
Jul 27 Javascript
JavaScript SHA512加密算法详细代码
Oct 06 Javascript
angular 组件通信的几种实现方式
Jul 13 Javascript
vue.js添加一些触摸事件以及安装fastclick的实例
Aug 28 Javascript
微信小程序非swiper组件实现的自定义伪3D轮播图效果示例
Dec 11 Javascript
vue实现带复选框的树形菜单
May 27 Javascript
vue实现购物车加减
May 30 Javascript
JS 去前后空格大全(IE9亲测)
Jul 15 #Javascript
Ext中下拉列表ComboBox组件store数据格式用法介绍
Jul 15 #Javascript
ExtJs设置GridPanel表格文本垂直居中示例
Jul 15 #Javascript
鼠标移动到图片名上,显示图片的简单实例
Jul 14 #Javascript
JS中获取数据库中的值的方法
Jul 14 #Javascript
js 实现日期灵活格式化的小例子
Jul 14 #Javascript
仿谷歌主页js动画效果实现代码
Jul 14 #Javascript
You might like
PHP中动态HTML的输出技术
2006/10/09 PHP
php unset全局变量运用问题的深入解析
2013/06/17 PHP
php bootstrap实现简单登录
2016/03/08 PHP
如何使用PHP给图片加水印
2016/10/12 PHP
Yii2数据库操作常用方法小结
2017/05/04 PHP
JavaScript入门教程 Cookies
2009/01/31 Javascript
非常棒的10款jQuery 幻灯片插件
2011/06/14 Javascript
深入理解javascript变量声明
2014/11/20 Javascript
js实现遮罩层弹出框的方法
2015/01/15 Javascript
javascript控制层显示或隐藏的方法
2015/07/22 Javascript
快速获取/设置iframe内对象元素的几种js实现方法
2016/05/20 Javascript
JS HTML5实现拖拽移动列表效果
2020/08/27 Javascript
jQuery表单事件实例代码分享
2016/08/18 Javascript
JS对HTML表格进行增删改操作
2016/08/22 Javascript
js实现的在线调色板功能完整实例
2016/12/21 Javascript
ECMAScript6--解构
2017/03/30 Javascript
快速使用node.js进行web开发详解
2017/04/26 Javascript
nodejs处理图片的中间件node-images详解
2017/05/08 NodeJs
Express + Node.js实现登录拦截器的实例代码
2017/07/01 Javascript
详解使用angular的HttpClient搭配rxjs
2017/09/01 Javascript
详解React Native顶|底部导航使用小技巧
2017/09/14 Javascript
小程序实现左右来回滚动字幕效果
2018/12/28 Javascript
vue+element创建动态的form表单及动态生成表格的行和列
2019/05/20 Javascript
express启用https使用小记
2019/05/21 Javascript
vue使用过滤器格式化日期
2021/01/20 Vue.js
Python自动化测试ConfigParser模块读写配置文件
2016/08/15 Python
Django之无名分组和有名分组的实现
2019/04/16 Python
Python操作Excel工作簿的示例代码(\*.xlsx)
2020/03/23 Python
浅谈keras中自定义二分类任务评价指标metrics的方法以及代码
2020/06/11 Python
印尼披萨外送专家:Domino’s Pizza印尼
2017/12/28 全球购物
自我鉴定范文
2013/11/10 职场文书
竞选班干部演讲稿100字
2014/08/20 职场文书
水浒传读书笔记
2015/06/25 职场文书
施工安全协议书
2016/03/22 职场文书
股东合作协议书模板2篇
2019/11/05 职场文书
python_tkinter弹出对话框创建
2022/03/20 Python