成組的單選框radio、成組的復選框checkbox以及區別


單選框radio、復選框checkbox均是可勾選的組件,但成組出現時——單選框radio只允許選中某一個狀態;而復選框checkbox可以同時選中多個狀態。

--------------------------------------------------------------------------------------------------

input控件的type設置為radio,控件類型即為單選框,默認被渲染成空圓圈,選中時空心圓圈中有一個黑實點。

當多個單選框radio的name屬性設置為同一個值時,則它們會被認為是一個組的單選框,只有某一個狀態的單選框可以被選中,其他狀態顯示為未選中狀態。為了區分不同的radio組件,需要給每一個radio設置不同的value。submit提交到服務器的數據只是被勾選中的radio的數據。

 

 

 

--------------------------------------------------------------------------------------------------

input控件的type設置為checkbox,控件類型即為復選框。

當多個復選框checkbox的name屬性設置為同一個值時,則它們會被認為是同一個組的復選框,與單選框不同的是,同一組的復選框可以同時被選中多個狀態。為了區分不同的checkbox組件,需要給每一個checkbox設置不同的value。submit提交到服務器的數據是Array類型,包含所有被選中的組件數據。

 

 

--------------------------------------------------------------------------------------------------

注意:

單選框選中后無法取消,只能通過選中同組的其他radio單選框來取消;而復選框可以通過再次點擊來取消當前選中。

因此,當需要取消選中操作的場景應用中,應該使用checkbox,而不是radio。例如:登錄時的“記住密碼”選項。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM