HTML複選框和單選框 checkbox和radio事件介紹_基礎知識

checkbox 和 radio的事件選擇一度讓我很迷惑。

開始以我對js的理解，我覺得change事件應該是最合理的，可惜啊ie下change事件是在改變後焦點離開時才觸發。
後來就用click mousedown等滑鼠事件取代。發現click比mousedown要更完美一些：

radio註冊了click事件以後，神奇的是用鍵盤上的上下左右選擇時，居然會觸發滑鼠事件，滾輪也會觸發，這種神奇的事情在mousedown下面是不會發生的。 （webkit不能使用上下左右選擇）
checkbox註冊click事件後，奇蹟再次上演，當我們用空格選中checkbox時，神奇的click事件再次觸發，而mousedown再次與奇蹟擦身而過。 （webkit還是不能用空格選）

讓我們都用click吧，給這兩位老兄減負吧，不要為了他們先天不足給他們綁定一堆事件了，對於這兩個傢伙click才是萬能的。膜拜一下~~~

在用表單設計調查表時，為了減少使用者的操作，使用選擇框是一個好主意，在HTML的標記中有兩種選擇框，即單選框和複選框，兩者的差異是單選框中的選項使用者只能選擇一項，而複選框中的選項使用者可以任意選擇多項，甚至全選。請看下面的範例:

下面給出這個範例的原始碼，結合程式碼來講各參數的設定:

你是否喜歡旅遊？請選擇：

複製程式碼 程式碼如下:

喜歡
不喜歡
無所謂

您對那些運動感興趣，請選擇：

複製代碼 代碼如下:

跑步
打球
登山
健美

從上面的原始碼可以看出，製作單選框只要把標記的type參數設為type= "radio"就行了;而製作複選框則只要把標記的type參數設為type="checkbox"就行了。至於實際應用中用那種選擇框，要根據實際需求而定。若只要使用者有一種選擇的，就用單選框，如本例中「你是否喜歡旅遊?」這個問題，使用者只能是一種選擇，所以採用了單選框;若允許使用者有多項選擇的內容，則採用複選框，如本例中的“你對那些運動感興趣?”這個問題，因一個人的興趣可能是多方面的，所以採用了複選框。

在標記中設定checked參數，則該選框就被預設為選取。如本例的第一個單選框(「喜歡」下面那個單選框)就設定為預設選中，這樣用戶若是想選擇「喜歡」的話，就可以不用再選了，當然，若用戶要選擇了“不喜歡”，則只要點擊“不喜歡”下的那單選框，而預設值會自動取消。用同樣的方法也可以設定某個複選框為預設被選取。但是複選框的預設選取不可濫用，否則會引起使用者的反感。

在radio裡面千萬要注意記得把所有的這個物件的name屬性都設為相同的，比如說上例的name="radiobutton" ，記住不是ID屬性，只有這樣才能達到單選的效果，不然的話上面例子的'喜歡'、'不喜歡'、'無所謂'就可以同時選上了，切記!