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 相关文章推荐
js实现单行文本向上滚动效果实例代码
Nov 28 Javascript
jQuery判断checkbox是否选中的小例子
Dec 02 Javascript
JavaScript实现判断图片是否加载完成的3种方法整理
Mar 13 Javascript
JS实现简单的二维矩阵乘积运算
Jan 26 Javascript
jquery实现无刷新验证码的简单实例
May 19 Javascript
js oncontextmenu事件使用详解
Mar 25 Javascript
JS实现的合并多个数组去重算法示例
Apr 11 Javascript
Webpack devServer中的 proxy 实现跨域的解决
Jun 15 Javascript
使用vuex存储用户信息到localStorage的实例
Nov 11 Javascript
微信小程序添加插屏广告并设置显示频率(一天一次)
Dec 06 Javascript
vue2.x 对象劫持的原理实现
Apr 19 Javascript
Element Tooltip 文字提示的使用示例
Jul 26 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
Terran历史背景
2020/03/14 星际争霸
php使用curl检测网页是否被百度收录的示例分享
2014/01/31 PHP
php递归创建目录的方法
2015/02/02 PHP
php实现小程序支付完整版
2018/10/09 PHP
PHP结合jquery ajax实现上传多张图片,并限制图片大小操作示例
2019/03/01 PHP
php中错误处理操作实例分析
2019/08/23 PHP
繁简字转换功能
2006/07/19 Javascript
javascript innerHTML、outerHTML、innerText、outerText的区别
2008/11/24 Javascript
isArray()函数(JavaScript中对象类型判断的几种方法)
2009/11/26 Javascript
js字符串日期yyyy-MM-dd转化为date示例代码
2014/03/06 Javascript
JavaScript fontsize方法入门实例(按照指定的尺寸来显示字符串)
2014/10/17 Javascript
javascript函数式编程实例分析
2015/04/25 Javascript
javascript通过元素id和name直接取得元素的方法
2015/04/28 Javascript
跟我学习javascript解决异步编程异常方案
2015/11/23 Javascript
vue-loader教程介绍
2017/06/14 Javascript
10 种最常见的 Javascript 错误(频率最高)
2018/02/08 Javascript
JQuery Ajax动态加载Table数据的实例讲解
2018/08/09 jQuery
使用form-create动态生成vue自定义组件和嵌套表单组件
2019/01/18 Javascript
微信小程序自定义组件实现环形进度条
2020/11/17 Javascript
vue-router定义元信息meta操作
2020/12/07 Vue.js
基于python的字节编译详解
2017/09/20 Python
两个元祖T1=('a', 'b'),T2=('c', 'd')使用匿名函数将其转变成[{'a': 'c'},{'b': 'd'}]的几种方法
2019/03/05 Python
Python如何使用正则表达式爬取京东商品信息
2020/06/01 Python
python tqdm库的使用
2020/11/30 Python
一张图片能隐含千言万语之隐藏你的程序代码
2012/12/13 HTML / CSS
英国健身超市:Fitness Superstore
2019/06/17 全球购物
Hotels.com泰国:酒店预订网站
2019/11/20 全球购物
中层竞聘演讲稿
2014/01/09 职场文书
幼儿园托班开学寄语
2014/01/18 职场文书
导师推荐信范文
2014/05/09 职场文书
庆祝儿童节标语
2014/10/09 职场文书
三方协议书
2015/01/27 职场文书
少年派的奇幻漂流观后感
2015/06/08 职场文书
电影雷锋观后感
2015/06/10 职场文书
贷款担保书范本
2015/09/22 职场文书
详解SQL报错盲注
2022/07/23 SQL Server