* {
font-size: 11px;
font-family: verdana, arial, sans-serif;
}
table {
border: 1px solid #ccc;
margin: 0 auto;
}
th {
background-color: #f7f7f7;
}
td, th {
padding: 15px;
border: 1px solid #ccc;
}
tr.alternate {
background-color: #efd;
}
.bold {
font-weight: bold;
}
.red {
color: red;
font-weight: bold;
}
.blue {
background-color: blue;
}
/* used with crosshairs.js */
.hoverhilight {
background-color: #ffffc0;
cursor: pointer;
}
.activecellhilight {
background-color: #c0dbff;
color: blue;
}
var hilightclass = "hoverhilight";
var activehilightclass = "activecellhilight";
var hilightactive = 1;
var hilightcol = 1;
var hilightrow = 1;
var hilighttopheader = 0;
var hilightleftheader = 0;
var hilightrightheader = 0;
var hilightbottomheader = 0;
var surroundactive = 0;
function initcrosshairstable(id, toppad, rightpad, bottompad, leftpad) {
var tableobj = document.getelementbyid(id);
var c = tableobj.rows[0].cells.length - rightpad;
var r = tableobj.rows.length - bottompad;
for (var i = toppad; i < r; i++)
{
for (var j = leftpad; j < c; j++)
{
if(!document.all) {
tableobj.rows[i].cells[j].setattribute("onmouseover","addhilight(this);");
tableobj.rows[i].cells[j].setattribute("onmouseout","removehilight(this);");
}
else
{
tableobj.rows[i].cells[j].onmouseover = function() { addhilight(this); }
tableobj.rows[i].cells[j].onmouseout = function() { removehilight(this); }
}
}
}
}
function addhilight(cell)
{
applyhilight(cell.parentnode.parentnode.parentnode,
cell.parentnode.rowindex, cell.cellindex, 1);
}
function removehilight(cell)
{
applyhilight(cell.parentnode.parentnode.parentnode,
cell.parentnode.rowindex, cell.cellindex, 0);
}
var oldrowclasses = "";
var oldheaderclasses = "";
var oldcellclasses = new array();
function applyhilight(obj, rowindex, colindex, state)
{
var w3cdom = (document.createelement && document.getelementsbytagname);
if (!w3cdom)
{
alert("this script requires w3c dom support")
return;
}
if (hilightclass == "") alert("please set a hilight class.");
if (hilightrow) applyhilightrow(obj, rowindex, colindex, state);
if (hilightcol) applyhilightcol(obj, rowindex, colindex, state);
if (hilighttopheader) applyhilighttopheader(obj, rowindex, colindex, state);
if (hilightleftheader) applyhilightleftheader(obj, rowindex, colindex, state);
if (hilightrightheader) applyhilightrightheader(obj, rowindex, colindex, state);
if (hilightbottomheader) applyhilightbottomfooter(obj, rowindex, colindex, state);
if (hilightactive) applyhilightactivecell(obj, rowindex, colindex, state);
if (surroundactive) applysurroundactivehilight(obj, rowindex, colindex, state);
}
function applyhilightleftheader(obj, rowindex, colindex, state)
{
var classarray;
var rowclasses = "";
if (state == 1)
{
obj.rows[rowindex].cells[0].classname += " " + hilightclass;
}
else
{
classarray = obj.rows[rowindex].cells[0].classname.split(" ");
for(var i = 0; i < (classarray.length - 1); i++)
if(classarray[i] != "") rowclasses += " " + classarray[i];
obj.rows[rowindex].cells[0].classname = rowclasses;
}
}
function applyhilightrightheader(obj, rowindex, colindex, state)
{
var classarray;
var rowclasses = "";
if (state == 1)
{
obj.rows[rowindex].cells[obj.rows[rowindex].cells.length-1].classname += " " + hilightclass;
}
else
{
classarray = obj.rows[rowindex].cells[obj.rows[rowindex].cells.length-1].classname.split(" ");
for(var i = 0; i < (classarray.length - 1); i++)
if(classarray[i] != "") rowclasses += " " + classarray[i];
obj.rows[rowindex].cells[obj.rows[rowindex].cells.length-1].classname = rowclasses;
}
}
function applyhilighttopheader(obj, rowindex, colindex, state)
{
var classarray;
var colclasses = "";
if (state == 1)
{
obj.rows[0].cells[colindex].classname += " " + hilightclass;
}
else
{
classarray = obj.rows[0].cells[colindex].classname.split(" ");
for(var i = 0; i < (classarray.length - 1); i++)
if(classarray[i] != "") colclasses += " " + classarray[i];
obj.rows[0].cells[colindex].classname = colclasses;
}
}
function applyhilightbottomfooter(obj, rowindex, colindex, state)
{
var classarray;
var colclasses = "";
if (state == 1)
{
obj.rows[obj.rows.length-1].cells[colindex].classname += " " + hilightclass;
}
else
{
classarray = obj.rows[obj.rows.length-1].cells[colindex].classname.split(" ");
for(var i = 0; i < (classarray.length - 1); i++)
if(classarray[i] != "") colclasses += " " + classarray[i];
obj.rows[obj.rows.length-1].cells[colindex].classname = colclasses;
}
}
function applyhilightrow(obj, rowindex, colindex, state)
{
if (state == 1)
{
oldrowclasses = obj.rows[rowindex].classname;
obj.rows[rowindex].classname = hilightclass;
}
else
{
obj.rows[rowindex].classname = oldrowclasses;
}
}
function applyhilightcol(obj, rowindex, colindex, state)
{
var cellclasses = new array();
if (state == 1)
{
for(var i = 0; i < obj.rows.length; i++)
{
cellclasses.push(obj.rows[i].cells[colindex].classname);
obj.rows[i].cells[colindex].classname += " " + hilightclass;
}
oldcellclasses = cellclasses;
}
else
{
oldcellclasses.reverse();
for(var i = 0; i < obj.rows.length; i++)
obj.rows[i].cells[colindex].classname = oldcellclasses.pop();
}
}
var oldactivecellclasses;
function applyhilightactivecell(obj, rowindex, colindex, state)
{
if (state == 1)
{
oldactivecellclasses = null;
oldactivecellclasses = obj.rows[rowindex].cells[colindex].classname;
obj.rows[rowindex].cells[colindex].classname += " " + activehilightclass;
}
else
{
var oldclasses = oldactivecellclasses.split(" ");
obj.rows[rowindex].cells[colindex].classname = "";
for(var i = 0; i < oldclasses.length; i++)
{
if(oldclasses[i] != hilightclass) obj.rows[rowindex].cells[colindex].classname += " " + oldclasses[i];
oldactivecellclasses = "";
}
}
}
function applysurroundactivehilight(obj, rowindex, colindex, state)
{
var surroundradius = 1;
var radiuscolor = "#c0dbff"
var cell;
if(!parseint(surroundradius)) return;
if (state == 1)
{
for(var i = (rowindex - surroundradius); i <= (rowindex + surroundradius); i++)
{
if (i < 0) continue;
if (!obj.rows[i]) continue;
for(var j = (colindex - surroundradius); j <= (colindex + surroundradius); j++)
{
if (j < 0) continue;
if (!obj.rows[i].cells[j]) continue;
cell = obj.rows[i].cells[j].style
cell.backgroundcolor = radiuscolor;
cell.opacity = (.5);
cell.mozopacity = (.5);
cell.khtmlopacity = (.5);
cell.filter = "alpha(opacity=50)";
}
}
obj.rows[rowindex].cells[colindex].style.backgroundcolor = "";
}
else
{
for(var i = (rowindex - surroundradius); i <= (rowindex + surroundradius); i++)
{
if (i < 0) continue;
if (!obj.rows[i]) continue;
for(var j = (colindex - surroundradius); j <= (colindex + surroundradius); j++)
{
if (j < 0) continue;
if (!obj.rows[i].cells[j]) continue;
cell = obj.rows[i].cells[j].style
cell.backgroundcolor = "";
cell.opacity = (1);
cell.mozopacity = (1);
cell.khtmlopacity = (1);
cell.filter = "alpha(opacity=100)";
}
}
}
}
编号 | 姓名 | 地址 | 电话 | |
---|---|---|---|---|
1 | a1 | b1 | c1 | d1 |
2 | a2 | b2 | c2 | d2 |
3 | a3 | b3 | c3 | d3 |
4 | a4 | b4 | c4 | d4 |
5 | a5 | b5 | c5 | d5 |
initcrosshairstable("crosstable", 1, 0, 0, 1);//控制
[ctrl+a 全选 注:如需引入外部js需刷新才能执行]