天天看點

js表格自動隔行變色

js表格自動隔行變色

tr.odd td {  

    color: #223;  

    background-color: #ec8;  

}  

tr.highlight td {  

    background-color: #e3e3e3;  

}   

 asda

js表格自動隔行變色

/** 

* 隔行換色,滑鼠移動上色 

* 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');  

            },  

                $(this).removeclass('overcolor');  

            }  

        );  

    }  

})(jquery);  

js表格自動隔行變色

//表格自動隔行變色,要變色的表格加上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() {  

                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;  

}