JavaScript代码判断点击第几个按钮


Posted in Javascript onDecember 13, 2015

最近很轻松,项目结束,趁个空余时间写了一段javascript代码实现判断点击第几个按钮的相关代码,具体代码如下所示:

<html>
   <head>
     <meta charset='utf-'>
   </head>
   <body>
     <button>第一个</button>
     <button>第二个</button>
     <button>第三个</button>
     <button>第四个</button>
     <button>第五个</button>
     <script>
       var but=document.getElementsByTagName('button');
       for(i=;i<but.length;i++){
         but[i].setAttribute('i',i+);
         but[i].onclick=function(){
           b=this.getAttribute('i');
           alert('这是第'+b+'个按钮');
         }
       }
     </script>
   </body>
 </html>

 下面一段代码给大家介绍JavaScript实现点击按钮后,再过60秒后才能再次点击此按钮

 注册的时候需要发送验证激活帐号的邮件,为了避免邮件的多次重复发送,所以可以在点击了发送后,设置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 相关文章推荐
麦鸡的TAB切换功能结合了javascript和css
Dec 17 Javascript
jQuery常用操作方法及常用函数总结
Jun 19 Javascript
JavaScript数组实现数据结构中的队列与堆栈
May 26 Javascript
详解React Native 采用Fetch方式发送跨域POST请求
Nov 15 Javascript
Vue核心概念Getter的使用方法
Jan 18 Javascript
Vue路由模块化配置的完整步骤
Aug 14 Javascript
JavaScript算法学习之冒泡排序和选择排序
Nov 02 Javascript
Vue-cli3多页面配置详解
Mar 22 Javascript
用vue 实现手机触屏滑动功能
May 28 Javascript
vue实现整屏滚动切换
Jun 29 Javascript
关于JavaScript数组去重的一些理解汇总
Sep 10 Javascript
Ajax异步刷新功能及简单案例
Nov 20 Javascript
JavaScript模块化开发之SeaJS
Dec 13 #Javascript
node.js require() 源码解读
Dec 13 #Javascript
JavaScript 模块的循环加载实现方法
Dec 13 #Javascript
javascript日期验证之输入日期大于等于当前日期
Dec 13 #Javascript
详解JavaScript正则表达式之RegExp对象
Dec 13 #Javascript
详解JavaScript基于面向对象之继承
Dec 13 #Javascript
轻松使用jQuery双向select控件Bootstrap Dual Listbox
Dec 13 #Javascript
You might like
php中获取关键词及所属来源搜索引擎名称的代码
2011/02/15 PHP
php获取汉字拼音首字母的方法
2015/10/21 PHP
php关联数组与索引数组及其显示方法
2018/03/12 PHP
转一个日期输入控件,支持FF
2007/04/27 Javascript
javascript function调用时的参数检测常用办法
2010/02/26 Javascript
jquery isType() 类型判断代码
2011/02/14 Javascript
基于jquery的不规则矩形的排列实现代码
2012/04/16 Javascript
JQuery触发radio或checkbox的change事件
2012/12/18 Javascript
文本域光标操作的jQuery扩展分享
2014/03/10 Javascript
不到30行JS代码实现Excel表格的方法
2014/11/15 Javascript
Javascript连接Access数据库完整实例
2015/08/03 Javascript
讲解JavaScript的Backbone.js框架的MVC结构设计理念
2016/02/14 Javascript
用JavaScript获取页面文档内容的实现代码
2016/06/10 Javascript
jQuery插件Echarts实现的渐变色柱状图
2017/03/23 jQuery
详解Vue整合axios的实例代码
2017/06/21 Javascript
js+html5实现复制文字按钮
2017/07/15 Javascript
layui导出所有数据的例子
2019/09/10 Javascript
sharp.js安装过程中遇到的问题总结
2020/04/02 Javascript
[03:10]超级美酒第四天 fy拉比克秀 大合集
2018/06/05 DOTA
python中使用smtplib和email模块发送邮件实例
2014/04/22 Python
使用python编写批量卸载手机中安装的android应用脚本
2014/07/21 Python
跟老齐学Python之Python文档
2014/10/10 Python
Python实现带参数与不带参数的多重继承示例
2018/01/30 Python
NumPy.npy与pandas DataFrame的实例讲解
2018/07/09 Python
Python : turtle色彩控制实例详解
2020/01/19 Python
python中提高pip install速度
2020/02/14 Python
python实现ftp文件传输功能
2020/03/20 Python
菲律宾购物网站:Lazada菲律宾
2018/04/05 全球购物
医药公司采购员岗位职责
2014/09/12 职场文书
社会实践活动总结
2015/02/05 职场文书
施工安全员岗位职责
2015/04/11 职场文书
母亲节感言
2015/08/03 职场文书
检讨书范文
2019/04/16 职场文书
golang json数组拼接的实例
2021/04/28 Golang
详解Java实现设计模式之责任链模式
2021/06/23 Java/Android
Python  lambda匿名函数和三元运算符
2022/04/19 Python