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 相关文章推荐
google jQuery 引用文件,jQuery 引用地址集合(jquery 1.2.6至jquery1.5.2)
Apr 24 Javascript
js动态删除div元素基本思路及实现代码
May 08 Javascript
jQuery无刷新上传之uploadify3.1简单使用
Jun 18 Javascript
Javascript将JSON日期格式化
Aug 23 Javascript
利用js编写响应式侧边栏
Sep 17 Javascript
详解Vue路由开启keep-alive时的注意点
Jun 20 Javascript
Javascript中Promise的四种常用方法总结
Jul 14 Javascript
利用10行js代码实现上下滚动公告效果
Dec 08 Javascript
React学习笔记之高阶组件应用
Jun 02 Javascript
微信小程序日历组件使用方法详解
Dec 29 Javascript
关于vue的npm run dev和npm run build的区别介绍
Jan 14 Javascript
layui时间控件选择时间范围的实现方法
Sep 28 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读取配置文件类实例(可读取ini,yaml,xml等)
2015/07/28 PHP
浅谈使用PHP开发微信支付的流程
2015/10/04 PHP
php 截取GBK文档某个位置开始的n个字符方法
2017/03/08 PHP
PHP如何根据文件头检测文件类型实例代码
2018/10/14 PHP
PHP设计模式之模板模式定义与用法详解
2018/12/20 PHP
PHP实现微信提现(企业付款到零钱)
2019/08/01 PHP
thinkphp5 模型实例化获得数据对象的教程
2019/10/18 PHP
Jquery常用技巧收集整理篇
2010/11/14 Javascript
JS中eval函数的使用示例
2013/07/21 Javascript
IE、FF、Chrome浏览器中的JS差异介绍
2013/08/13 Javascript
js添加绑定事件的方法
2016/05/15 Javascript
微信小程序仿朋友圈发布动态功能
2018/07/15 Javascript
nodejs对项目下所有空文件夹创建gitkeep的方法
2019/08/02 NodeJs
微信小程序实现购物车代码实例详解
2019/08/29 Javascript
微信小程序swiper实现文字纵向轮播提示效果
2020/01/21 Javascript
[03:05]DOTA2英雄基础教程 嗜血狂魔
2013/12/10 DOTA
python赋值操作方法分享
2013/03/23 Python
python模拟事件触发机制详解
2018/01/19 Python
Python实现获取汉字偏旁部首的方法示例【测试可用】
2018/12/18 Python
Python使用os.listdir()和os.walk()获取文件路径与文件下所有目录的方法
2019/04/01 Python
Python matplotlib以日期为x轴作图代码实例
2019/11/22 Python
python的reverse函数翻转结果为None的问题
2020/05/11 Python
浅析关于Keras的安装(pycharm)和初步理解
2020/10/23 Python
python中翻译功能translate模块实现方法
2020/12/17 Python
python爬虫scrapy框架之增量式爬虫的示例代码
2021/02/26 Python
HTML5中的nav标签学习笔记
2016/06/24 HTML / CSS
数学检讨书1000字
2014/02/24 职场文书
合伙协议书范本
2014/04/21 职场文书
大学生党员批评与自我批评
2014/09/28 职场文书
运动会宣传稿100字
2015/07/23 职场文书
大学入学感言
2015/08/01 职场文书
七年级作文之冬景
2019/11/07 职场文书
Java8中Stream的一些神操作
2021/11/02 Java/Android
【海涛教你打DOTA】死灵飞龙第一视角解说
2022/04/01 DOTA
JAVA 线程池(池化技术)的实现原理
2022/04/28 Java/Android
MySql数据库 查询时间序列间隔
2022/05/11 MySQL