radio 單選按鈕 選中多個

admin發表於2019-07-08

關於radio單選按鈕的基本用法可以參閱HTML input radio 單選按鈕一章節。

既然是單選按鈕,那就是多個單選按鈕在同一時刻只能選中一個,比如對於性別的選擇。

但是有不少初學者反饋,程式碼中的單選按鈕可以同時選中多項。

看如下簡單程式碼例項:

[HTML] 純文字檢視 複製程式碼執行程式碼
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<style>
input{
  width:30px;
  height:30px;
  border:1px dotted blue;
}    
</style>    
</head>
<body>
<input type="radio" name="a"/>
<input type="radio" name="b"/>
<input type="radio" name="c"/>
</body>
</html>

程式碼執行演示如下:

a:3:{s:3:\"pic\";s:43:\"portal/201907/08/112927xxcpxb6v5x5cce8k.jpg\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

可以看到三個單選按鈕竟然能夠被同時選中,難道定義是錯誤的。

其實並非如此,程式碼簡單分析如下:

(1).name相同的單選按鈕被視為一組。

(2).同一組單選按鈕中只能有一個被同時選中。

(3).但是上述程式碼中,name屬性值各不相同,所以可以被同時選中。

(4).如果將它們的name屬性值改為同一個,那麼此時只能有一個被選中。

相關文章