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