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 相关文章推荐
Jquery中增加参数与Json转换代码
Nov 20 Javascript
javascript实现面向对象类的功能书写技巧
Mar 07 Javascript
在js文件中如何获取basePath处理js路径问题
Jul 10 Javascript
js日期相关函数总结分享
Oct 15 Javascript
鼠标拖拽移动子窗体的JS实现
Feb 25 Javascript
微信JS接口汇总及使用详解
Jan 09 Javascript
JavaScript使用DeviceOne开发实战(二) 生成调试安装包
Dec 01 Javascript
js表单中选择框值的获取及表单的序列化
Dec 17 Javascript
js实现密码强度检测【附示例】
Mar 30 Javascript
再谈javascript常见错误及解决方法
Sep 16 Javascript
微信小程序图片选择、上传到服务器、预览(PHP)实现实例
May 11 Javascript
JavaScript解析及序列化JSON的方法实例分析
Jan 04 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
星际中一些鲜为人知的详细资料
2020/03/04 星际争霸
Terran兵种对照表
2020/03/14 星际争霸
PHP之变量、常量学习笔记
2008/03/27 PHP
php不用内置函数对数组排序的两个算法代码
2010/02/08 PHP
PHP逐行输出(ob_flush与flush的组合)
2012/02/04 PHP
对比分析php中Cookie与Session的异同
2016/02/19 PHP
Zend Framework校验器Zend_Validate用法详解
2016/12/09 PHP
PHP批斗大会之缺失的异常详解
2019/07/09 PHP
php写app用的框架整理
2019/09/29 PHP
greybox——不开新窗口看新的网页
2007/02/20 Javascript
国外的为初学者写的JavaScript教程
2008/06/09 Javascript
使用jQuery Ajax功能时需要注意的一个问题(内存溢出)
2012/05/30 Javascript
js实现横向伸展开的二级导航菜单代码
2015/08/28 Javascript
JS+CSS实现的经典tab选项卡效果代码
2015/09/16 Javascript
跟我学习javascript的call(),apply(),bind()与回调
2015/11/16 Javascript
jQuery Easyui 验证两次密码输入是否相等
2016/05/13 Javascript
JavaScript判断数组重复内容的两种方法(推荐)
2016/06/06 Javascript
JS+CSS实现下拉刷新/上拉加载插件
2017/03/31 Javascript
jQuery EasyUI结合zTree树形结构制作web页面
2017/09/01 jQuery
vue中配置mint-ui报css错误问题的解决方法
2017/10/11 Javascript
Vue中render方法的使用详解
2018/01/26 Javascript
微信小程序封装多张图片上传api代码实例
2019/12/30 Javascript
[49:08]Secret vs VP 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
Python内置的字符串处理函数整理
2013/01/29 Python
Python迭代器和生成器介绍
2015/03/06 Python
Python实现控制台进度条功能
2016/01/04 Python
详解Django 中是否使用时区的区别
2018/06/14 Python
Python使用xlrd实现读取合并单元格
2020/07/09 Python
python使用多线程查询数据库的实现示例
2020/08/17 Python
如何用canvas实现在线签名的示例代码
2018/07/10 HTML / CSS
马来西亚网上购物平台:ezbuy
2018/02/13 全球购物
Clarks其乐鞋荷兰官网:Clarks荷兰
2019/07/05 全球购物
高级工程师岗位职责
2013/12/15 职场文书
单位活动策划方案
2014/08/17 职场文书
2019自荐信该如何写呢?
2019/07/05 职场文书
mysql事务隔离级别详情
2021/10/24 MySQL