颜色选择器控件

• 下载源代码 - 3.06 KB

引言

我在一个 ASP.NET 项目上工作，遇到了需要颜色选择器的需求。我在网上搜索了一下，找到了一些下拉列表选择器和弹出控件。但它们不是我想要的，所以我创建了一个满足我需求的控件。好吧，它很简单，并且在一定程度上解决了我的问题。

使用代码

我们使用一个 HTML 表格，每个单元格都有不同的颜色。单击链接时，此表格将隐藏/显示。当用户单击单元格时，将调用一个 JavaScript 函数，该函数将颜色代码分配给文本框。每个表格单元格都设置了其背景颜色属性。单击单元格时，我们调用 JavaScript 函数 onclick="javascript:toggleLayer( 'color1' , this,'TextBox1');"，它会将所选单元格的背景颜色设置为文本框的颜色。

这是 JavaScript

//
function toggleLayer( whichLayer, Colorcntrl ,txtboxcntrl)
{
  var elem, vis;
      if( document.getElementById ) 
        elem = document.getElementById( whichLayer );
            else if( document.all )
                    elem = document.all[whichLayer];
                        else if( document.layers )
                            elem = document.layers[whichLayer];
  vis = elem.style;
  
  if(vis.display==''&&elem.offsetWidth!=undefined&&elem.offsetHeight!=undefined)
      vis.display = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'block':'none';
  vis.display = (vis.display==''||vis.display=='block')?'none':'block';
  
  //Set Textbox value and background
  if(Colorcntrl != null && txtboxcntrl != null)
  {
    document.getElementById(txtboxcntrl).value = Colorcntrl.style.backgroundColor;
    document.getElementById(txtboxcntrl).style.backgroundColor = 
                                         Colorcntrl.style.backgroundColor;
  }
}