龙岩易富通网络科技有限公司

龙岩小程序开发,龙岩分销系统

Jquery实现对Table表格奇偶行设置颜色及移动鼠标行变色

2016.07.27 | 1738阅读 | 0条评论 | javascript

//页面加载,调用js

$(document).ready(function () {

            pageLoad();   //页面加载,隔行变色

        });

 

//页面加载时,对Table表格移动鼠标行变色操作,通用方法

function pageLoad() {

 

    //table 中设置class属性[class= msgtable]

    $("table[class=msgtable]").each(function () {

        var _this = $(this);

        //设置偶数行和奇数行颜色

        _this.find("tr:even").css("background-color", "#f8f8f8");

        _this.find("tr:odd").css("background-color", "#f0f0f0");

 

        //鼠标移动隔行变色hover用法关键

        _this.find("tr:not(:first)").hover(function () {

            $(this).attr("bColor", $(this).css("background-color")).css("background-color", "#E0E0E0").css("cursor", "pointer");

        }, function () {

            $(this).css("background-color", $(this).attr("bColor"));

        });

 

    });

}


赞 (

发表评论