colPick 颜色选择器

html:

<input type="text" id="b_symbol" placeholder="请点击方块选择颜色" autocomplete="off" readonly="readonly" style="width: 224px;"/>
				<div class="chose_color" id="chose_color" title="选择颜色"></div>

js 初始化：

function initColPick(c_color){
	$('#chose_color').colpick({
	    layout:'rgbhex',//可能的值为“ full”（RGB，HEX和HSB字段），“ rgbhex”（无HSB字段）和hex（无HSB，无RGB）。
	    submit:0,
	    color:c_color,
	    onBeforeShow:function(a){
	        $(this).colpickSetColor(rgb2hex($(this).css("background-color")));
	    },
		onChange: function (color, color2,color3) {
			//hsb的值:color,十六进制字符:color2,rgb的值:color3,
            $("#chose_color").css("background-color","#"+color2);
            var rgb_value = color3.r + "," +  color3.g + "," +  color3.b;
            $("#b_symbol").val(rgb_value);
        },
        onSubmit:function(hsb,hex,rgb,el){
			$(el).css('background-color','#'+ hex);
			$(el).colpickHide();
		}
	});
}
	//rgb转16进制
function zero_fill_hex(num, digits) {
    var s = num.toString(16);
    while (s.length < digits)
        s = "0" + s;
    return s;
}
function rgb2hex(rgb) {
    if (rgb.charAt(0) == '#')
        return rgb;
    var ds = rgb.split(/\D+/);
    var decimal = Number(ds[1]) * 65536 + Number(ds[2]) * 256 + Number(ds[3]);
    return "" + zero_fill_hex(decimal, 6);
}

//数据回显
var b_symbol = "255,255,255";
$('#chose_color').css("background-color","rgb("+b_symbol+")");
var sym_split = b_symbol.split(",");
var r_val = parseInt(sym_split[0]);
var g_val = parseInt(sym_split[1]);
var b_val = parseInt(sym_split[2]);
//{r:255, g:0, b:0}
initColPick({r:r_val, g:g_val, b:b_val});