JavaScript实现点击复选框改选选中行的颜色

2008-11-04 18:54:00 | 【
sharejs.com
sharejs.com
http://www.sharejs.com
http://www.sharejs.com
http://www.sharejs.com
http://www.sharejs.com
http://www.sharejs.com
http://www.sharejs.com

当用户点击行前面的复选框按钮时,表格的行背景变色,当取消复选框的选择时,行恢复原来的颜色,只能在IE下运行

第一步:
在网页<head>区添加以下代码

<script language="javascript" for=aho event="onclick">
 var srcElem = findParentObj(event.srcElement, "TR")
 srcElem.runtimeStyle.backgroundColor ? srcElem.runtimeStyle.removeAttribute("backgroundColor") : srcElem.runtimeStyle.backgroundColor = "#EEEE00"
</script>

<script language="javascript">

        /*****************************************************
         *  Share JavaScript (http://www.ShareJS.com)
         * 使用此脚本程序,请保留此声明
         * 获取此脚本以及更多的JavaScript程序,请访问 http://www.ShareJS.com
         ******************************************************/
    
function findParentObj(obj, strTagName, strId)
{
 while ( obj  && 
    !(!strTagName || obj.tagName == strTagName.toUpperCase())  && 
     (!strId || obj.id == strId)
   )
  obj = obj.parentElement
 return obj
}
</script>


第二步:
在网页<body>区添加 一下代码
<table align="center" width=200>
<tr><td><input type=checkbox id=aho></td>
<td><a href="http://www.sharejs.com">sharejs.com</a></td></tr>
<tr><td><input type=checkbox id=aho></td>
<td><a href="http://www.sharejs.com">sharejs.com</a></td></tr>
<tr><td><input type=checkbox id=aho></td>
<td>http://www.sharejs.com</td></tr>
<tr><td><input type=checkbox id=aho></td>
<td>http://www.sharejs.com</td></tr>
<tr><td><input type=checkbox id=aho></td>
<td>http://www.sharejs.com</td></tr>
<tr><td><input type=checkbox id=aho></td>
<td>http://www.sharejs.com</td></tr>
<tr><td><input type=checkbox id=aho></td>
<td>http://www.sharejs.com</td></tr>
<tr><td><input type=checkbox id=aho></td>
<td>http://www.sharejs.com</td></tr>
</table>

下载"JavaScript实现点击复选框改选选中行的颜色"

  • 本地下载
  • 本地下载2

相关资源