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 设置选中行的样式的实现代码
May 24 Javascript
jquery 动态创建元素的方式介绍及应用
Apr 21 Javascript
javascript实现的弹出层背景置灰-模拟(easyui dialog)
Dec 27 Javascript
javascript实现window.print()去除页眉页脚
Dec 30 Javascript
莱鸟介绍javascript onclick事件
Jan 06 Javascript
jquery点击切换背景色的简单实例
Aug 25 Javascript
Bootstrap CSS使用方法
Dec 23 Javascript
Node.js 使用流实现读写同步边读边写功能
Sep 11 Javascript
echarts学习笔记之图表自适应问题详解
Nov 22 Javascript
elementUI Vue 单个按钮显示和隐藏的变换功能(两种方法)
Sep 04 Javascript
Vue实现点击显示不同图片的效果
Aug 10 Javascript
多种类型jQuery网页验证码插件代码实例
Jan 09 jQuery
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 number_format() 函数定义和用法
2012/06/01 PHP
destoon调用自定义模板及样式的公告栏
2014/06/21 PHP
php+mysql不用递归实现的无限级分类实例(非递归)
2014/07/08 PHP
PHP文件操作方法汇总
2015/07/01 PHP
PHP实现上传文件并存进数据库的方法
2015/07/16 PHP
PHP操作FTP类 (上传、下载、移动、创建等)
2016/03/31 PHP
php适配器模式简单应用示例
2019/10/23 PHP
jQuery 快速结束当前正在执行的动画
2013/11/20 Javascript
jquery dialog open后,服务器端控件失效的快速解决方法
2013/12/19 Javascript
JQuery打造省市下拉框联动效果
2014/05/18 Javascript
jQuery使用animate创建动画用法实例
2015/08/07 Javascript
JS利用cookie记忆当前位置的防刷新导航效果
2015/10/15 Javascript
Bootstrap安装环境配置教程分享
2016/05/27 Javascript
NodeJS实现微信公众号关注后自动回复功能
2017/05/31 NodeJs
JavaScript变量作用域_动力节点Java学院整理
2017/06/27 Javascript
Vue.js实现按钮的动态绑定效果及实现代码
2017/08/21 Javascript
详解如何解决vue开发请求数据跨域的问题(基于浏览器的配置解决)
2018/11/12 Javascript
Vue 2.0 侦听器 watch属性代码详解
2019/06/19 Javascript
移动端手指操控左右滑动的菜单
2019/09/08 Javascript
python连接oracle数据库实例
2014/10/17 Python
python操作字典类型的常用方法(推荐)
2016/05/16 Python
Python Tkinter模块实现时钟功能应用示例
2018/07/23 Python
python 解压pkl文件的方法
2018/10/25 Python
Django REST framework 视图和路由详解
2019/07/19 Python
树莓派3 搭建 django 服务器的实例
2019/08/29 Python
python实现根据给定坐标点生成多边形mask的例子
2020/02/18 Python
python能自学吗
2020/06/18 Python
Pytorch模型迁移和迁移学习,导入部分模型参数的操作
2021/03/03 Python
利用CSS3实现文本框的清除按钮相关的一些效果
2015/06/23 HTML / CSS
canvas压缩图片以及卡片制作的方法示例
2018/12/04 HTML / CSS
密封类可以有虚函数吗
2014/08/11 面试题
物业招聘计划书
2014/01/10 职场文书
采购人员的个人自我评价
2014/01/16 职场文书
公开承诺书格式
2014/05/21 职场文书
软件售后服务方案
2014/05/29 职场文书
道路运输企业安全生产责任书
2014/07/28 职场文书