# Checkbox 多选框
一组备选项中进行多选。
# 基础样式
选项1
选项2
选项3
选项4（disabled）
选项5（disabled）
扩展选项
扩展选项（disabled）
▼显示代码
# 扩展样式
# ① 按钮样式
按钮样式的复选组合。
# 采用对象方式渲染
▼显示代码
# 采用comp的方式渲染
▼显示代码
# ② 小图片样式
小图片样式的复选组合。
▼显示代码
# ③ 图文列表样式
图文列表样式的复选组合。
▼显示代码
#
# 调用方式
| 调用方式 |
|---|
| var xxx = new CtpUicomCheckbox(elObj, options); |
# 参数列表：
| 参数 | 说明 | 类型 | 默认值 | ||
|---|---|---|---|---|---|
| elObj | - | - | 被渲染的dom(必填项) | 可传入一个 DOM 对象或字符串； 若传入字符串，则会将其作为参数传入 document.querySelector以获取到对应 DOM 节点 | - |
| options（类型：object）(必填项) | styleType | 按钮样式："button" 小图片样式："smallImg" 图文列表样式："imageText" (选填项) | string | "button" | |
| name | - | 当前checkbox编组的name值,用于form提交 | boolean / string / number | - | |
| item（类型：array） 由1-N个object组成 每个object下的内容包含右侧这些内容 | id | 为checkbox指定一个id，用于dom查找等功能 值必须唯一（选填） | string | - | |
| label | 文字（选填） | boolean / string / number | - | ||
| value | value值（选填） | boolean / string / number | - | ||
| checked | 是否选中（选填） | boolean | false | ||
| disabled | 是否禁用（选填） | boolean | false | ||
| className | 支持传入扩展class（选填） | string | - | ||
| style | 支持传入扩展style（选填） | string | - | ||
| clickFun | 自定义事件（选填） | function(以对象方式渲染时) string(以comp方式渲染时) | - | ||
| img | 图片的地址（仅小图片、图文列表时必填，否则 选填） | string | - | ||
| text | 文本内容 （仅图文列表时必填，否则 选填） | string | - | ||
# 方法列表（以对象方式渲染时可用）
| 方法 | 说明 | 参数 | 参数说明 | 参数类型 |
|---|---|---|---|---|
| checked | 设置某个checkbox为选中状态 | index | 设置为选中状态的checkbox的序号(必填项) | number，从0开始 |
| checkedAll | 设置所有checkbox为选中状态 | |||
| unchecked | 取消某个checkbox为选中状态 | index | 设置为选中状态的checkbox的序号(必填项) | number，从0开始 |
| uncheckedAll | 取消所有checkbox的选中状态 | |||
| enabled | 启用某个checkbox | index | 设置为选中状态的checkbox的序号(必填项) | number，从0开始 |
| enabledAll | 启用所有checkbox | |||
| disabled | 禁用某个checkbox | index | 设置为选中状态的checkbox的序号(必填项) | number，从0开始 |
| disabledAll | 禁用所有checkbox | |||
| getAllCheckedValue | 获取所有为选中状态的值 | |||
| destory | 销毁元素 | - | - | - |
以对象方式渲染时的方法调用示例，请点击下方的“显示代码”查看
▼显示代码
# 方法列表（以comp方式渲染时可用）
| 方法 | 说明 | 参数 | 参数说明 | 参数类型 |
|---|---|---|---|---|
| checked | 设置某个checkbox为选中状态 | elObj, index | elObj:请见页末"elObj"的说明 index:设置为选中状态的checkbox的序号(必填项) | index: number，从0开始 |
| checkedAll | 设置所有checkbox为选中状态 | elObj | 请见页末"elObj"的说明 | String或dom对象 |
| unchecked | 取消某个checkbox为选中状态 | elObj, index | elObj:请见页末"elObj"的说明 index:设置为选中状态的checkbox的序号(必填项) | index: number，从0开始 |
| uncheckedAll | 取消所有checkbox的选中状态 | elObj | 请见页末"elObj"的说明 | String或dom对象 |
| enabled | 启用某个checkbox | elObj, index | elObj:请见页末"elObj"的说明 index:设置为选中状态的checkbox的序号(必填项) | index: number，从0开始 |
| enabledAll | 启用所有checkbox | elObj | 请见页末"elObj"的说明 | String或dom对象 |
| disabled | 禁用某个checkbox | elObj, index | elObj:请见页末"elObj"的说明 index:设置为选中状态的checkbox的序号(必填项) | index: number，从0开始 |
| disabledAll | 禁用所有checkbox | elObj | 请见页末"elObj"的说明 | String或dom对象 |
| getAllCheckedValue | 获取dom下所有ctpUiCheckbox为选中状态的值 | elObj | 请见页末"elObj"的说明 | String或dom对象 |
| destory | 销毁元素 | - | - | - |
以对象方式渲染时的方法调用示例，请点击下方的“显示代码”查看
▼显示代码
# elObj:
被渲染的dom(必填项)
可传入一个 DOM 对象或字符串；
若传入字符串，则会将其作为参数传入 document.querySelector以获取到对应 DOM 节点