改变表格单元格的背景颜色

功能        : 改变表格单元格的背景颜色
作者        : zjly
修改时间    : 2007-04-11
电子邮件    : zjly4@163.com
参数
id          : 必选。确定变色的表格
mod         : 可选。表示几次颜色一个循环，默认为2
colorList   : 可选。里面颜色可用指定的颜色代替，以改变表格背景色
colorOver   : 可选。鼠标移到表格单元格上时的颜色，默认为灰色
color       : 可选。以1表示鼠标移动时表格单元格变色，其它数值均不变色
步骤
1、指定要变色的表格ID
2、根据需要选择要更改的参数
3、输出表格
示例
<table id="table">
<tr>
    <td> </td>
</tr>
<tr>
    <td> </td>
</tr>
<tr>
    <td> </td>
</tr>
<tr>
    <td> </td>
</tr>
<tr>
    <td> </td>
</tr>
</table>
<script type="text/javascript" src="/tablecolor.js">
var tab=new changeColor()
tab.setid("table");
tab.setmod(3);
tab.setColorList("#eee,#ccf,#fff");
tab.setColorOver("#f5f5f5");
tab.setColor(0);
</script>
*************************************************/
function changeColor(){
this.id     = "";
this.mod    = 2;
this.colorList = "#c5c5c5,#fff";
this.colorOver = "#f5f5f5";
this.color    = 1;
}
changeColor.prototype.setId=function(id){
this.id=id;
}
changeColor.prototype.setMod=function(mod){
this.mod=mod;
}
changeColor.prototype.setColorList=function(colorlist){
this.colorList=colorlist;
}
changeColor.prototype.setColorOver=function(colorover){
this.colorOver=colorover;
}
changeColor.prototype.setColor=function(color){
this.color=color;
}
changeColor.prototype.goOut=function(){
id      = this.id;
mod     = this.mod;
colorList = this.colorList;
colorOver = this.colorOver;
color   = this.color;
var o=document.getElementById(id).getElementsByTagName("TR");
var str=colorList.split(",");
if(mod<=1){
    mod=1;
}
if(mod>str.length){
    mod=str.length;
}
if(color!=1){
    color=0;
}
for(var i=0; i<o.length; i++){
    var x=i%mod;
    if(typeof colorList=="string" && colorList.indexOf(",")!=-1){
      o[i].style.background=str[x];
      o[i].id=i;
      o[i].c=colorOver;
      o[i].m=mod;
      if(color == 1){//判断是否鼠标移上时变色
        o[i].οnmοuseοver=function(){
          this.style.background=this.c;
        }
        o[i].οnmοuseοut=function(){
          var x=this.id%this.m;
          this.style.background=str[x];
        }
      }
    }
}
}

改变表格单元格的背景颜色相关推荐

java td背景色_jQuery：无法更改表格单元格的背景颜色
我花了太多时间解决这个简单的问题,而不是我应该 . 因此,我想看看这个,因为我不明白为什么它不起作用 . 我习惯用jQuery更改CSS属性,但在这种特殊情况下它不起作用 . 所以这是我的功能,应该改 ...
element etable表格改变某个单元格的背景颜色
// 改变某一列单元格背景颜色tableCellStyle({ row, column, rowIndex, columnIndex }) {console.log(row); // 基本都在这里面 ...
html表格单元格设置背景颜色
转载于:https://www.cnblogs.com/wangjian8888/p/6082212.html
VBA在Excel中的应用（一)：改变符合条件单元格的背景颜色
Jiahua Jin VBA在Excel中的应用(一):改变符合条件单元格的背景颜色在使用excel处理数据的时候,为了能更清晰的标示出满足特定条件的单元格,对单元格添加背景色是不错的选择.手工处理 ...
Element UI Element Plus之改变表格单元格颜色
首先官网文档中有 Table 表格组件的属性说明,只需要在el-table标签中加上:cell-style="xxx",以及实现该方法即可.Element UI框架和Elemen ...
POI 单元格设置背景颜色失效（背景色设置方式），以及背景颜色生效后单元格边框线消失问题解决
单元格设置背景颜色失效原因当只设定 setFillForegroundColor 时是不行的,还需要再设置一下 setFillPattern 即 style.setFillForegroundCol ...
Aspose.Words 设置背景颜色4种效果（当前段落设置背景颜色，所有段落文字设置背景颜色，当前单元格设置背景颜色，当前段落文字设置背景颜色）
1.当前段落设置背景颜色实现代码: Aspose.Words.Document doc = new Document();//新建一个空白的文档 Aspose.Words.DocumentBuild ...
html table转excel单元格带背景颜色
html table转excel单元格带背景颜色在浏览器端将html的table转成Excel,可以参考下面的库 https://github.com/JackGit/table2excel.js ...
html某一单元格边框颜色,javascript – jQuery：更改ONE表格单元格的边框颜色
我在这里有一个简单的 HTML选项表: blue green red cream 具有相关样式的CSS: td { background-color: #FFF; border: 1px solid ...

改变表格单元格的背景颜色

改变表格单元格的背景颜色相关推荐

最新文章

热门文章