var background_color = "rgb(229,243,255)"; //新背景色

var frozen_back_color = new Array();

var back_color = new Array();

var $last_tr;

var i = 0;

/*基础知识：

*   var 声明变量

*           background_color 新的背景颜色

*           $last_tr  用于实现操作原始行对象

*           frozen_back_color 存储原始颜色值

*           back_color  存储原始颜色值

*           new Array(); 声明为数组类型

*   $  Jquery 构造器函数  ${#id名称} id选择器  ${标签名称（div ，body）}  ${.类名值} 类选择器  学习地址：https://www.w3school.com.cn/jquery/jquery_selectors.asp

*   bind() 方法为被选元素添加一个或多个事件处理程序，并规定事件发生时运行的函数。

*   typeof 可以用来检测给定变量的数据类型，可能的返回值：

*   $(this)是jquery对象，能调用jquery的方法,JS中this 是指当前对象，例如在按钮中增加function(this){}this就是按钮对象

*   .attr() 方法设置或返回被选元素的属性值。

*   .each() 方法规定为每个匹配元素规定运行的函数。

*   children() 方法返回返回被选元素的所有直接子元素

*   css() 方法设置或返回被选元素的一个或多个样式属性。

*   $(this).index() 返回相对于同级元素的位置 实验 https://www.runoob.com/jquery/misc-index.html

*

* */

/*

* 实现过程

* 1.当鼠标移动到行的时候将行的样式参数保存到临时数组中，并改变当前行样式。

* 2.当鼠标离开的时候，将当前对象赋予$last_tr

* 3.当鼠标到达行的时候，通过操作$last_tr,将之前的行变为原来的颜色，并对当前行颜色进行改变

* */

/*获取类名为.x-table下的 tr 标签 ,监听鼠标是否穿过，穿过的话执行方法*/

$(".x-table tr").bind("mouseenter", function () {

    /*如果$last_tr 和当前鼠标穿过行是存在的那么执行*/

   if (typeof($last_tr) != "undefined"&&typeof($(this).attr("id")) != "undefined") {

       /*如果id=content-container的元素下 id=frozen-west 的元素的id值存在那么执行*/

            if (typeof($("#content-container #frozen-west").attr("id")) != "undefined") {

                /*id=content-container 下id=$last_tr 的id 进行遍历*/

                $("#content-container #" + $last_tr.attr("id")).each(function () {

                    /*返回所有td单元格 然后进行遍历*/

                    $(this).children("td").each(function () {

                        /*对id的 背景颜色进行配置改为frozen_back_color[i][$(this).index()]*/

                        $(this).css("background-color", frozen_back_color[i][$(this).index()]);

                    });

                    /*对i进行加1 */

                    i = i + 1;

                });

                /*初始化*/

                i = 0;

            }

            /*如果获取不到id=content-container节点下的id=frozen-west 那么执行*/

            else {

                /*遍历$last_tr下的节点td标签*/

                $last_tr.children("td").each(function () {

                    /*更改td标签的背景色为  back_color[$(this).index()]*/

                    $(this).css("background-color", back_color[$(this).index()]);

                });

            }

            frozen_back_color = [];

            back_color = [];

        }

/*保存单元格原始颜色到frozen_back_color */

/*是当前元素下是否存在id元素*/

    if (typeof($(this).attr("id")) != "undefined") {

        /*id=content-container的标签下是否存在id=frozen-west的元素*/

        if (typeof($("#content-container #frozen-west").attr("id")) != "undefined") {

            /*在id=content-container 下id =this.value的元素进行遍历 */

            $("#content-container #" + $(this).attr("id")).each(function () {

                /*初始化 frozen_back_color[i]为数组 */

                frozen_back_color[i] = new Array();

                /*在当前元素下遍历td 标签*/

                $(this).children("td").each(function () {

                    /*把当前标签的值赋予 frozen_back_color[i] */

                    frozen_back_color[i][$(this).index()] = $(this).css("background-color");

                    /*改变当前标签元素的样式为 background_color */

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

                });

                /*遍历过程中对i进行累加获得对应的角标*/

                i = i + 1;

            });

            /*遍历结束，初始化i为0*/

            i = 0;

        }

        /*改变单元行背景颜色*/

        else {

            /*对当前td元素进行遍历*/

            $(this).children("td").each(function () {

                /*将当前标签的样式赋予back_color */

                back_color[$(this).index()] = $(this).css("background-color");

                /*改变当前元素的值为背景色*/

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

            });

        }

    }

});

/*当鼠标离开时，执行上面的函数*/

$(".x-table tr").bind("mouseleave", function () {

    /*如果id可以找到那么执行*/

    if (typeof($(this).attr("id")) != "undefined") {

        /*将当前对象赋值给$last_tr   */

        $last_tr = $(this);

    }

});