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;
}
}
}