Css代码
- tr.odd td {
- color: #223;
- background-color: #ec8;
- }
- tr.highlight td {
- color: #223;
- background-color: #e3e3e3;
- }
asda
Java代码
- /**
- * 隔行换色，鼠标移动上色
- * Create by phoenix @ 2013-11-19
- */
- (function ($) {
- $.fn.tabChColor = function (options) {
- var options = options || {};
- $(this).find('tr:even').addClass('smallblack');
- $(this).find('tr').hover(
- function () {
- $(this).addClass('overcolor');
- },
- function () {
- $(this).removeClass('overcolor');
- }
- );
- }
- })(jQuery);
Java代码
- //表格自动隔行变色，要变色的表格加上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;
- }
