1.单独给每个radio添加点击事件

<fieldset id="form-gra-time">
  <legend>请选择日期粒度:</legend>
  <label>日

    <input name="gra-time" value="day" type="radio" checked="checked">

  </label>
  <label>周

    <input name="gra-time" value="week" type="radio">

  </label>
  <label>月

    <input name="gra-time" value="month" type="radio">

  </label>
</fieldset>

var radio=document.getElementsByName("gra-time");

for(var i=0;i<radio.length;i++){

  if(radio[i].checked){

    radio[i].addEventListener("click",clickFunction);

  }

}

判断选中的radio的值,使用radio[i].value;

给每个radio绑定事件是不推荐的。

2.委托事件

var form_gra_time=document.getElementById("form-gra-time");
form_gra_time.addEventListener("click",function(e){
  if(e.target.name=="gra-time"){
    graTimeChange();
  }
})

/*这里判断目标直接使用了target,如果需要跨浏览器的话可以写成var target=e.target||e.srcElement。同样的addEventListener也是不能直接用的

  function addEventHandler(ele, event, hanlder) {
    if (ele.addEventListener) {
      ele.addEventListener(event, hanlder, false);
    } else if (ele.attachEvent) {
      ele.attachEvent("on"+event, hanlder);
    } else {
      ele["on" + event] = hanlder;
    }
  }

*/

function graTimeChange(){

  /*判断选择的是哪个radio*/

  for(var i=0;i<radio.length;i++){

    if(radio[i].checked){

      str=radio[i].value;

    }

  }

}

给radio添加点击事件的更多相关文章

  1. iOS开发小技巧 - label中的文字添加点击事件

    Label中的文字添加点击事件 GitHub地址:https://github.com/lyb5834/YBAttributeTextTapAction 以前老师讲过类似的功能,自己懒得回头看了,找了 ...

  2. 【Swift 2.1】为 UIView 添加点击事件和点击效果

    前言 UIView 不像 UIButton 加了点击事件就会有点击效果,体验要差不少,这里分别通过自定义和扩展来实现类似 UIButton 的效果. 声明 欢迎转载,但请保留文章原始出处:) 博客园: ...

  3. echart字符云之添加点击事件

    // 路径配置 require.config({ paths : { echarts : 'jquery/echarts-2.2.7/build/dist' } }); // 使用EChart.js画 ...

  4. ThinkPHP框架下,给jq动态添加的标签添加点击事件移除标签

    jq移除标签主要就是$("#要移除的id").remove();不再赘述,这里要提醒的是jq中动态添加标签后怎样添加点击事件.一般的jq添加点击事件是用这种方法$("#i ...

  5. 继承UIView的子控件添加点击事件

    UITapGestureRecognizer*tapGesture = [[UITapGestureRecognizer alloc]initWithTarget:selfaction:@select ...

  6. 如何在UILable上添加点击事件?

    最近开始学习iOS开发,今天上来写第一个iOS笔记 昨天碰到一个需求,在UILable上添加点击事件,网上找了写资料,有人建议用透明的UIButton覆盖,有人建议写一个集成自UILable的类,扩展 ...

  7. jquery无法为动态生成的元素添加点击事件的解决方法

    遇到 jquery无法为动态生成的元素添加点击事件,谷歌一下,整理一下解决方法如下: (<li>中间的元素是动态生成的), 现在想为<i>添加点击事件, 例子如下: <d ...

  8. Qt:添加点击事件的Label并显示图片

    1.给label添加点击事件 Qt中原本的label是没有点击事件的,如果想添加点击事件的话,可以继承QLabel类并重载鼠标事件(比如mousePressedEvent),然后在鼠标事件中发送一个信 ...

  9. echarts对每个data[i]的图片添加点击事件

    1.综述:以饼图为例,只需要对echarts对象option添加以下几行代码即可 //添加点击事件(单击),还有其他鼠标事件和键盘事件等等 myChart1.on("click", ...

随机推荐

  1. 【洛谷P1207】双重回文数 【USACO1.2】

    P1207 [USACO1.2]双重回文数 Dual Palindromes 题目描述 如果一个数从左往右读和从右往左读都是一样,那么这个数就叫做"回文数".例如,12321就是一 ...

  2. xmlns详解(转载)

    我们经常会在网页中碰到形如<html xmlns=”http://www.w3.org/2001/xhtml”>这样的代码, 或在是android 编码中的main.xml中看到形如< ...

  3. poj 2406 Power Strings(KMP入门,next函数理解)

    Power Strings Time Limit: 3000MS   Memory Limit: 65536K Total Submissions: 37685   Accepted: 15590 D ...

  4. mytop安装,使用mytop监控MySQL性能 (总结)

    mytop 是一个类似 Linux 下的 top 命令风格的 MySQL 监控工具,可以监控当前的连接用户和正在执行的命令. 1. 安装TermReadKey    下载地址:  wget  http ...

  5. jstree设置checkbox单选

    jstree设置插件checkbox只允许单选 jstree version console.log($.jstree.version); 3.3.8 单选配置参数: $.jstree.default ...

  6. PyCharm使用之配置SSH Interpreter

      在文章PyCharm使用之利用Docker镜像搭建Python开发环境中,该文章介绍了在PyCharm中如何利用Docker镜像搭建Python开发环境.在本文中,将会介绍如何使用PyCharm来 ...

  7. 去掉CSS赘余代码,CSS可以更简洁

    本篇文章适合css新手学习,对于已经掌握了css的朋友们也可以通过本片文章来复习知识. 作者通过实践,认为在有些情况下css的代码是可以更加简洁的,多数情况下是因为新手对于一些具有多属性的元素代码不能 ...

  8. Linux下安装zookeeper-3.4.13

    转载至:https://yq.aliyun.com/articles/662422 1.zookeeper官网下载安装包http://mirrors.hust.edu.cn/apache/zookee ...

  9. koa上传excel文件并解析

    1.中间键使用 koa-body npm install koa-body --save const koaBody = require('koa-body'); app.use(koaBody({ ...

  10. vagrant up 时提示错误 cound not open file

    根据教程:https://laravel-china.org/docs/laravel-development-environment/5.5/development-environment-wind ...