中国IT动力,最新最全的IT技术教程
最新100篇 | 推荐100篇 | 专题100篇 | 排行榜 | 搜索 | 在线API文档 | 网通镜像
首 页 | 程序开发 | 操作系统 | 软件应用 | 图形图象 | 网络应用 | 精文荟萃 | 教育认证 | 硬件维护 | 未整理篇 | 站长教程
ASP JS PHP工程 ASP.NET 网站建设 UML J2EESUN .NET VC VB VFP 网络维护 数据库 DB2 SQL2000 Oracle Mysql
服务器 Win2000 Office C DreamWeaver FireWorks Flash PhotoShop 上网宝典 CorelDraw 协议大全 网络安全 微软认证
硬件维护  CPU  主板  硬盘  内存  显卡  显示器  键盘鼠标  声卡音箱  打印机  机箱电源  BIOS  网卡  C#  Java  Delphi  vs.net2005
  当前位置:> 程序开发 > 编程语言 > .NET > 临时文章
自动改变CheckBoxList选择项目的背景颜色
作者:未知 时间:2005-07-27 21:53 出处:CSDN 责编:chinaitpower
              摘要:自动改变CheckBoxList选择项目的背景颜色

效果如下图:

实现原理:

 

 

通过为CheckBoxList绑定一个前台的onclick事件,来实现选择项的颜色改变。由于CheckBoxListItem在前台会变成如下标签:

 

 

<tr>

 

 

     <td>

 

 

<input id="cbl_i" type="checkbox" name="cbl:i" />     (iitem的序号)

 

 

<label for="cbl_i">ItemText</label>   ItemTextitem的文字)

 

 

</td>

 

 

</tr>

 

 

如果单单是为document.getElementById(cbl_i)指定样式的话,那只有那个CheckBox会有底色,而后面的文字就没有。为了使整个项都出现底色,所以就要设置它的上一级的<td>标签的样式。

 

 

实现代码:

 

 

     前台:

 

 

<style type="text/css">

 

 

.ItemBgColor {BACKGROUND-COLOR: #ccccff}

 

 

</style>

 

 

<script language="javascript">

 

 

function ChangeSelectedItemColor(checkBoxListId, numOfItems)

 

 

{

 

 

   // Get the checkboxlist object.

 

 

    var objCtrl = document.getElementById(checkBoxListId);

 

 

    if(objCtrl == null)

 

 

    {

 

 

        return;

 

 

    }

 

 

   

 

 

    for(i = 0; i < numOfItems; i++)

 

 

    {

 

 

       var name=checkBoxListId+':'+i;

 

 

       var objItem = document.getElementById(checkBoxListId + '_' + i);

 

 

       var isCheck = objItem.checked;

 

 

       if(isCheck==true)

 

 

       {

 

 

          objItem.parentElement.className = 'ItemBgColor';

 

 

       }

 

 

       else

 

 

       {

 

 

          objItem.parentElement.className = '';

 

 

       }

 

 

     }

 

 

}

 

 

</script>

 

 

     后台:

 

 

cbl.Attributes.Add("onclick","ChangeSelectedItemColor('cbl','"+cbl.Items.Count+"');");

 

 

 

 


关闭本页
 
首页 | 投资与合作 | 服务条款 | 隐私政策 | 收藏本站 | 设为首页 | 新用户注册 | 免责声明 | 使用帮助
Copyright ©2005-2008 chinaitpower.com All rights reserved. www.chinaitpower.com 版权所有