js練習----radio name屬性定義單選按鈕組

黴鼓勵發表於2019-07-11
JS

js菜鳥----單選radio name屬性


設定name相同的單選鈕為同一組 單選按鈕

name 屬性用於表單提交後向伺服器傳送資料，或者在Javascript引用表單資料。

注意： 在表單提交後只有表單元素的 name 屬性才會傳遞資料值。

簡單的單選項程式碼如下（提交後顯示提交內容）：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鳥教程(runoob.com)</title>
</head>
<body>

<form>
你想喝哪種飲料?<br>
<input type="radio" name="drink" id="tea"  value="tea">tea<br>
<input type="radio" name="drink"  id="milk" value="milk">milk<br>
<input type="radio" name="drink"  id="coffee" value="coffee">coffee
</form>
<input type="submit" value="下單" onclick="order()">
	
</body>
<script>   

    function order(){
        var radio = document.getElementsByName("drink");
        for(var i = 0; i < radio.length; i++)
        if(radio[i].checked){
            alert("下單成功：你點了" + radio[i].value);
            break;
        }
    }
 
</script>
</html>

具體可檢視新增連結描述[/ 笑臉]

相關文章