@*以下 是测试html 颜色选择器的*@
@*<
a
href
=
"#"
mce_href
=
"#"
onclick
=
"initColorPicker('demo'); return false"
id
=
"demo"
style
=
"position:absolute;left:200px"
>颜色选择</
a
>*@
@*<
script
type
=
"text/JavaScript"
>
var colorPicker = function (idStr) {
this.colorPool = ["#000000", "#993300", "#333300",
"#003300", "#003366", "#000080", "#333399", "#333333", "#800000",
"#FF6600", "#808000", "#008000", "#008080", "#0000FF", "#666699",
"#808080", "#FF0000", "#FF9900", "#99CC00", "#339966", "#33CCCC",
"#3366FF", "#800080", "#999999", "#FF00FF", "#FFCC00", "#FFFF00",
"#00FF00", "#00FFFF", "#00CCFF", "#993366", "#CCCCCC", "#FF99CC",
"#FFCC99", "#FFFF99", "#CCFFCC", "#CCFFFF", "#99CCFF", "#CC99FF",
"#FFFFFF"];
this.initialize(idStr);
}
colorPicker.prototype = {
initialize: function (idStr) {
var count = 0;
var html = '';
var self = this;
html += '<
table
cellspacing
=
"5"
cellpadding
=
"0"
border
=
"2"
bordercolor
=
"#000000"
style
=
"cursor:pointer;background:#ECE9D8"
mce_style
=
"cursor:pointer;background:#ECE9D8"
>';
// html+= '<
tr
><
td
align
=
"center"
colspan
=
"8"
width
=
"160"
height
=
"20"
id
=
"currentColor"
bgcolor
=
"#ffffff"
>当前颜色</
td
></
tr
>';
for (i = 0; i <
5
; i++) {
html += "<tr>";
for (j = 0; j <
8
; j++) {
html += '<td
align
=
"center"
width
=
"20"
height
=
"20"
style
=
"background:' + this.colorPool[count] + '"
mce_style
=
"background:' + this.colorPool[count] + '"
unselectable
=
"on"
> </
td
>';
count++;
}
html += "</
tr
>";
}
html += '</
table
>';
this.trigger = document.getElementById(idStr);
this.p = document.createElement('p');
this.p.innerHTML = html;
var tds = this.p.getElementsByTagName('td');
for (var i = 0, l = tds.length; i &
l
t; l; i++) {
tds[i]
.onclick
=
function
() {
self.setColor(this.style.backgroundColor, idStr);
}
}
this.p.id
=
'myColorPicker'
;
this.trigger.parentNode.appendChild(this.p);
this.p.style.position
=
'absolute'
;
this.p.style.left
= this.trigger.offsetLeft + 'px'
this.p.style.top = (this.trigger.clientHeight + this.trigger.offsetTop) + 'px';
//this.hide();
this.trigger.onclick
=
function
() {
if (self.p.style.display == 'none') {
self.show();
return false;
} else {
self.hide();
return false;
}
}
},
setColor: function (c, idStr) {
this.hide();
// document.getElementById(idStr)
.style.backgroundColor
= c //proEditor.setColor(c); //自己定义函数决定setColor的功能
document.getElementById(idStr)
.style.color
= c
//var
rgb2Hex
=
colorRGB2Hex
(c);
//alert(rgb2Hex);
},
hide: function () {
this.p.style.display
=
'none'
},
show: function () {
this.p.style.display
=
'block'
}
}
function initColorPicker(str) {
picker
=
new
colorPicker(str);
}
function colorRGB2Hex(color) {
var
rgb
=
color
.split(',');
var
r
=
parseInt
(rgb[0].split('(')[1]);
var
g
=
parseInt
(rgb[1]);
var
b
=
parseInt
(rgb[2].split(')')[0]);
var
hex
=
"#"
+ ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
return hex;
}
</script>*@