如何打开一个颜色对话框？

引用别人在这里发过的代码
<script>
var oInitColor = "000000"
var oBject='<OBJECT id=dlgHelper CLASSID="clsid:3050f819-98b5-11cf-bb82-00aa00bdce0b" width="0px" height="0px"></OBJECT>'function oCP(){
if(!document.getElementById('dlgHelper'))document.body.insertAdjacentHTML("BeforeEnd",oBject)
var oColor = dlgHelper.ChooseColorDlg(oInitColor).toString(16)
oColor=("000000"+oColor).substr(oColor.length)
demo.style.color="#"+oColor
oInitColor=oColor
}
</script>
<input type=button onclick=oCP() value="Show ColorPanel">
<br><textarea style="width:100%;height:300" id=demo style="overflow:hidden;border:1px solid #999999">测试演示TestDemo</textarea>
<html>
  <head>
    <title>ChooseColorDlg</title>
    <meta name = "generator" content = "Microsoft Visual Studio.NET 7.0"/>
    <meta name="vs_targetSchema" content = "http://schemas.microsoft.com/intellisense/ie5"/>
    <meta content = "text/html;charset=gb2312" http-equiv = "content-Type" name = "eXtensible-Office XP"/>
    <script language = "jscript">
      //初始化全局变量sInitColor, 用来储存颜色代码
      var sInitColor = null;

      //显示“颜色”对话框并提供给用户进行选择
      function showcc() {
        //如果尚未选择过颜色
        if (sInitColor == null) {
          //显示默认对话框
          var sColor = dlghelper.ChooseColorDlg();
        }
        //如果已经选择过颜色
        else {
          //显示默认对话框, 并且自动选中sInitColor储存的颜色
          //如果之前选择的是自定义颜色，那么虚线框会停留在第一个颜色上
          var sColor = dlghelper.ChooseColorDlg(sInitColor);
        }

        //把sColor的值转换成HTML可接受的颜色字符串
        sColor = sColor.toString(16);         //有的时候会取得80ff这类的值，那么需要在前面用00补齐
        if (sColor.length < 6) {
//根据sColor的长度判断应该补几个0
var sTS = "000000".substring(0, 6 - sColor.length);
//连接字符串，使sColor完整
sColor = sTS.concat(sColor);
} //改变页面背景色
document.bgColor = "#" + sColor;
//把用户选择的颜色储存在sInitColor变量中
sInitColor = sColor;
}
</script>
    <style></style>
  </head>

  <body>
    <button onclick = "showcc();">ChooseColor</button>
    <object id = "dlghelper" classid = "clsid:3050f819-98b5-11cf-bb82-00aa00bdce0b" height = "0" width = "0" ></object>
  </body>
</html>
RGB设色：)
<head>
<STYLE type=text/css>TD {
FONT-SIZE: 14px
}
.outerSlideContainer {
BORDER-BOTTOM: buttonface 1px inset; BORDER-LEFT: buttonface 1px inset; BORDER-RIGHT: buttonface 1px inset; BORDER-TOP: buttonface 1px inset; HEIGHT: 20px; MARGIN-LEFT: 10px; WIDTH: 300px
}
.sliderHandle {
BACKGROUND: buttonface; BORDER-BOTTOM: white 2px outset; BORDER-LEFT: white 2px outset; BORDER-RIGHT: white 2px outset; BORDER-TOP: white 2px outset; FONT-SIZE: 12px; HEIGHT: 18px; OVERFLOW: hidden; TEXT-ALIGN: center; WIDTH: 33px
}
.lineContainer {
HEIGHT: 18px; POSITION: absolute; WIDTH: 298px
}
.line {
FILTER: alpha(style=1); HEIGHT: 18px; OVERFLOW: hidden; POSITION: relative; WIDTH: 298px
}
#colorBox {
BORDER-BOTTOM: buttonface 1px inset; BORDER-LEFT: buttonface 1px inset; BORDER-RIGHT: buttonface 1px inset; BORDER-TOP: buttonface 1px inset; HEIGHT: 50px; WIDTH: 50px
}
</STYLE>
<SCRIPT type=text/javascript>
var dragobject = null;
var type;
var onchange = "";
var tx;
var ty;function getReal(el, type, value) {
temp = el;
while ((temp != null) && (temp.tagName != "BODY")) {
if (eval("temp." + type) == value) {
el = temp;
return el;
}
temp = temp.parentElement;
}
return el;
}function moveme_onmousedown() {
var tmp = getReal(window.event.srcElement, "className", "sliderHandle"); //Traverse the element tree
if(tmp.className == "sliderHandle") {
dragobject = tmp; //This is a global reference to the current dragging object onchange = dragobject.getAttribute("onchange"); //Set the onchange function
if (onchange == null) onchange = "";
type = dragobject.getAttribute("type"); //Find the type if (type=="y") //Vertical
ty = (window.event.clientY - dragobject.style.pixelTop);
else //Horizontal
tx = (window.event.clientX - dragobject.style.pixelLeft); window.event.returnValue = false;
window.event.cancelBubble = true;
}
else {
dragobject = null; //Not draggable
}
}function moveme_onmouseup() {
if(dragobject) {
dragobject = null;
}
}function moveme_onmousemove() {
if(dragobject) {
if (type=="y") {
if(event.clientY >= 0) {
if ((event.clientY - ty >= 0) && (event.clientY - ty <= dragobject.parentElement.style.pixelHeight - dragobject.style.pixelHeight)) {
dragobject.style.top = event.clientY - ty;
}
if (event.clientY - ty < 0) {
dragobject.style.top = "0";
}
if (event.clientY - ty > dragobject.parentElement.style.pixelHeight - dragobject.style.pixelHeight - 0) {
dragobject.style.top = dragobject.parentElement.style.pixelHeight - dragobject.style.pixelHeight;
} dragobject.value = dragobject.style.pixelTop / (dragobject.parentElement.style.pixelHeight - dragobject.style.pixelHeight);
eval(onchange.replace(/this/g, "dragobject"));
}
}
else {
if(event.clientX  >= 0) {
if ((event.clientX  - tx >= 0) && (event.clientX - tx <= dragobject.parentElement.clientWidth - dragobject.style.pixelWidth)) {
dragobject.style.left = event.clientX - tx;
}
if (event.clientX - tx < 0) {
dragobject.style.left = "0";
}
if (event.clientX - tx > dragobject.parentElement.clientWidth - dragobject.style.pixelWidth - 0) {
dragobject.style.left = dragobject.parentElement.clientWidth - dragobject.style.pixelWidth;
} dragobject.value = dragobject.style.pixelLeft / (dragobject.parentElement.clientWidth - dragobject.style.pixelWidth);
eval(onchange.replace(/this/g, "dragobject"));
}
}

window.event.returnValue = false;
window.event.cancelBubble = true;
}
}function setValue(el, val) {
el.value = val;
if (el.getAttribute("TYPE") == "x")
el.style.left =  val * (el.parentElement.clientWidth - el.style.pixelWidth);
else
el.style.top =  val * (el.parentElement.clientHeight - el.style.pixelHeight); eval(el.onchange.replace(/this/g, "el"))
}document.onmousedown = moveme_onmousedown;
document.onmouseup = moveme_onmouseup;
document.onmousemove = moveme_onmousemove;document.write('<style type="text/css"> .sliderHandle {position: relative; cursor: default;} </style>');
</SCRIPT>
<SCRIPT type=text/javascript>

</SCRIPT>
</head><body onload=init()>
<TABLE>
  <TBODY>
  <TR>
    <TD align=right>Red:</TD>
    <TD><SPAN class=outerSlideContainer>
      <DIV class=lineContainer id=redRight style="BACKGROUND: rgb(255,0,0)">
      <DIV class=line id=redLeft style="BACKGROUND: rgb(0,0,0)"></DIV></DIV>
      <DIV class=sliderHandle id=redSlider type="x" value="0"
      onchange="update(this)">0 </DIV></SPAN></TD>
    <TD align=middle rowSpan=3 vAlign=center>
      <DIV id=colorBox></DIV></TD></TR>
  <TR>
    <TD align=right>Green:</TD>
    <TD><SPAN class=outerSlideContainer>
      <DIV class=lineContainer id=greenRight style="BACKGROUND: rgb(0,255,0)">
      <DIV class=line id=greenLeft style="BACKGROUND: rgb(0,0,0)"></DIV></DIV>
      <DIV class=sliderHandle id=greenSlider type="x" value="0"
      onchange="update(this)">0 </DIV></SPAN></TD></TR>
  <TR>
    <TD align=right>Blue:</TD>
    <TD><SPAN class=outerSlideContainer>
      <DIV class=lineContainer id=blueRight style="BACKGROUND: rgb(0,0,255)">
      <DIV class=line id=blueLeft style="BACKGROUND: rgb(0,0,0)"></DIV></DIV>
      <DIV class=sliderHandle id=blueSlider type="x" value="0"
      onchange="update(this)">0 </DIV></SPAN></TD></TR></TBODY></TABLE>
</body>

调试易

如何打开一个颜色对话框？

解决方案 »