成组的单选框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