ColorPicker 颜色选择器
用于颜色选择,支持多种格式。
基础用法
移动到下拉菜单上,展开更多操作。
有默认值
无默认值
▼显示代码
选择透明度
▼显示代码
预定义颜色
▼显示代码
不同尺寸
▼显示代码
参数
你可以通过修改$.fn.colorPicker.defaults
来修改全局默认配置,也可以在初始化时传入指定配置$(el).colorPicker({xx: xx})
。
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
value | 初始值 | string | - | - |
disabled | 是否禁用 | boolean | - | false |
size | 尺寸 | string | medium / small / mini | - |
showAlpha | 是否支持透明度选择 | boolean | - | false |
colorFormat | 颜色的格式 | string | hsl / hsv / hex / rgb | 'hex' (showAlpha 为 false )或 'rgb' (showAlpha 为 true ) |
popperClass | ColorPicker 下拉框的类名 | string | - | - |
predefine | 预定义颜色 | array | - | - |
change | 当绑定值变化时触发,回调参数为当前值 | function | - | - |
activeChange | 面板中当前显示的颜色发生改变时触发,回调参数为当前显示的颜色值 | function | - | - |
方法
你可以通过调用$(el).colorPicker('xxx')
来调用颜色选择器方法。
方法 | 说明 | 举例 |
---|---|---|
disable | 禁用选择器 | $(el).colorPicker('disable') |
enable | 取消禁用状态 | $(el).colorPicker('enable') |
set | 设置颜色值 | $(el).colorPicker('set', 'rgba(255, 0, 0, 0.5)') |
get | 获取颜色值 | $(el).colorPicker('get') |
← Rate 评分 Transfer 穿梭框 →