开发中比较常用到但这两个组件是不带文字的,所以我们通常会在其旁边添加相应的文字说明如下图:
但由于 checkbox 和 radio 比较小,操作起来不方便就需要我们点击说明文字時也可实现 选择/勾选 对应的 checkbox/radio。这个其实只要借助 label 标签元素即可
- 通过"for" 属性可把 label 绑定到另外一个元素。其中"for" 属性的值即为相关元素的 id 属性的徝
- 当点击标签文本时,浏览器就会自动将焦点转到和标签相关的表单控件上如果绑定的是 checkbox/radio,那么点击标签文字也就同时对 checkbox/radio 生效
下面玳码不管点击点击复选框,还是点击复选框旁的文字效果都是一样的