1. 程式人生 > 實用技巧 >獲取單選框的值

獲取單選框的值

<!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        window.onload = function () 
        {
            var oBtn = document.getElementById("btn");
            var oFruit = document.getElementsByName("fruit");       /*給相同的name*/
            oBtn.onclick = function () 
            {
                //使用for迴圈遍歷所有的單選框
                for(var i=0;i<oFruit.length;i++)
                {
                    //判斷當前遍歷的單選框是否選中(也就是checked是否為true)
                    if(oFruit[i].checked)
                    {
                        alert(oFruit[i].value);        /*表單元素都預設有個value值*/
                    }
                }
            };
        }
    </script>
</head>
<body>
    <div>
        <label><input type="radio" name="fruit" value="蘋果" checked/>蘋果</label>      /*給相同的name*/
        <label><input type="radio" name="fruit" value="香蕉" />香蕉</label>
        <label><input type="radio" name="fruit" value="西瓜" />西瓜</label>
    </div>
    <input id="btn" type="button" value="獲取" />
</body>
</html>