日期:2014-05-16  浏览次数:20391 次

js表格自动隔行变色
tr.odd td {
	color: #223;
	background-color: #ec8;
}
tr.highlight td {
	color: #223;
	background-color: #e3e3e3;
} 
?
//表格自动隔行变色,要变色的表格加上id属性
function stripeTables() {
	if (!document.getElementsByTagName) return false;
	var tables = document.getElementsByTagName("table");
	for (var i=0; i<tables.length; i++) {
		var odd = false;
		//alert(tables.length);
		if(tables[i].id){ //加id属性的显示
			var rows = tables[i].getElementsByTagName("tr");
			for (var j=0; j<rows.length; j++) {
				//alert(rows.length);
				if (odd == true) {
					addClass(rows[j],"odd");
					odd = false;
				}else {
					odd = true;
				}	
			}
		}
	}
}
//表格自动高亮显示光标所在行
function highlightRows() {
	if (!document.getElementsByTagName) return false;
	var tables = document.getElementsByTagName("table");
	for (var i=0; i<tables.length; i++) {
		if(tables[i].id){ //加id属性的显示
			var rows = tables[i].getElementsByTagName("tr");
			for (var j=0; j<rows.length; j++) {
				rows[j].oldClassName = rows[j].className;
				rows[j].onmouseover = function() {
					addClass(this,"highlight");	
				}
				rows[j].onmouseout = function() {
					this.className = this.oldClassName;	
				}	
			}
		}
	}
}

addLoadEvent(stripeTables);
addLoadEvent(highlightRows);

//点击tr后将tr所在的checkbox改变,
var old_row_bg;
var selected_row;
function selectRow(comp,setTo,value){    
	if(selected_row!=null){
		selected_row.style.backgroundColor=old_row_bg;
	}
	selected_row=comp;
	old_row_bg=comp.style.backgroundColor;
	comp.style.backgroundColor="#FFFF55";
	document.getElementById(setTo).checked=!document.getElementById(setTo).checked;
}