复制代码 代码如下:

(function($){

$.fn.extend({

selectColor:function(){

var _d = new Date();

var _tem = _d.getTime();

return this.each(function(){

var showColor = function(_obj){

var _left = parseInt($(_obj).offset().left);

var _top = parseInt($(_obj).offset().top);

var _width = parseInt($(_obj).width());

var _height = parseInt($(_obj).height());

var _maxindex = function(){

var ___index = 0;

$.each($("*"),function(i,n){

var __tem = $(n).css("z-index");

if(__tem>0)

{

if(__tem > ___index)

{

___index = __tem + 1;

}

}

});

return ___index;

}();

var colorH = new Array('00','33','66','99','CC','FF');

var ScolorH = new Array('FF0000','00FF00','0000FF','FFFF00','00FFFF','FF00FF');

var _str = new Array();

for(var n = 0 ; n < 6 ; n++)

{

_str.push('<tr height="11">');

_str.push('<td+colorH[n]+colorH[n]+colorH[n]+'"></td>');

for(var i = 0 ; i < 3; i++)

{

for(var j = 0 ; j < 6 ; j++)

{

_str.push('<td+colorH[i]+colorH[j]+colorH[n]+'"></td>');

}

}

_str.push('</tr>');

}

for(var n = 0 ; n < 6 ; n++)

{

_str.push('<tr height="11">');

_str.push('<td+ScolorH[n]+'"></td>')

for(var i = 3 ; i < 6; i++)

{

for(var j = 0 ; j < 6 ; j++)

{

_str.push('<td+colorH[i]+colorH[j]+colorH[n]+'"></td>');

}

}

_str.push('</tr>');

}

var colorStr = '<div id="colorShowDiv_'+_tem+'"+_maxindex+';left:'+(_left+_width)+'px;top:'+(_top+_height)+'px;"><table><tr><td><div id="colorShow_'+_tem+'"></div></td><td><input id="color_txt_'+_tem+'" type="text" value="#FFFFFF" /></td></tr></table><table id="colorShowTable_'+_tem+'" cellpadding="0" cellspacing="1">'+_str.join('')+'</table></div>'

$("body").append(colorStr);

var _currColor;

var _currColor2;

$("#colorShowTable_"+_tem+" td").mouseover(function(){

var _color = $(this).css("background-color");

if(_color.indexOf("rgb")>=0)

{

var _tmeColor = _color;

_tmeColor = _color.replace("rgb","");

_tmeColor = _tmeColor.replace("(","");

_tmeColor = _tmeColor.replace(")","");

_tmeColor = _tmeColor.replace(new RegExp(" ","gm"),"");

var _arr = _tmeColor.split(",");

var _tmeColorStr = "#";

for(var ii = 0 ; ii < _arr.length ; ii++)

{

var _temstr = parseInt(_arr[ii]).toString(16);

_temstr = _temstr.length < 2 ? "0"+_temstr : _temstr;

_tmeColorStr += _temstr;

}

}

$("#color_txt_"+_tem).val(_tmeColorStr);

$("#colorShow_"+_tem).css("background-color",_color);

_currColor = _color;

_currColor2 = _tmeColorStr;

$(this).css("background-color","#FFFFFF");

});

$("#colorShowTable_"+_tem+" td").mouseout(function(){

$(this).css("background-color",_currColor);

});

$("#colorShowTable_"+_tem+" td").click(function(){

$(_obj).val(_currColor2);

});

}

$(this).click(function(){

showColor(this);

});

var _sobj = this;

$(document).click(function(e){

e = e ? e : window.event;

var tag = e.srcElement || e.target;

if(_sobj.id==tag.id)return;

var _temObj = tag;

while(_temObj)

{

if(_temObj.id=="colorShowDiv_"+_tem)return;

_temObj = _temObj.parentNode;

}

$("#colorShowDiv_"+_tem).remove();

});

});

}

});

})(jQuery);

使用方法：

复制代码 代码如下:

$(document).ready(function(){

$("#要绑定的ID").selectColor();

});

注意：要绑定的对像一定要是文本输入框