首页 > 其他 > 详细

成组的单选框radio、成组的复选框checkbox

时间:2020-06-09 22:49:02      阅读:80      评论:0      收藏:0      [点我收藏+]

单选框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。例如:登录时的“记住密码”选项。

 

成组的单选框radio、成组的复选框checkbox

原文:https://www.cnblogs.com/xuwennn/p/13081109.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!