给radio添加点击事件

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;

　　　　}

　　}

}

转载于:https://www.cnblogs.com/YangqinCao/p/5395608.html