每次点击的length都是为0，该怎么改，求帮忙

```DigsurGallery = {};
DigsurGallery.Rolling = function() {
this.change = null;
this.length = 0;
this.Arr = [];
this.alength;

}
// 对象下的一个方法
DigsurGallery.Rolling.prototype.FadeInOut = function(name, HasPaging, array, Barray) {
// 定义一个对象，这个对象对应着DigsurGallery.Rolling
var _this = this;
// 获取 盒子的名字
var oDiv = $('#' + name);
// 遍历数组，创建ul与li，并且赋给Id
for(var i = 0; i < array.length; i++) {
var oUlPageOne = $("

");
for(var l = 0; l < array[i].length; l++) {
var oli = $("");
oUlPageOne.append(oli);
var oImg = $("")
$(oImg).attr('src', array[i][l]);
oli.append(oImg);
}
oDiv.append(oUlPageOne);
$(oUlPageOne).attr('id', 'test' + i);

}
// 设置样式
oDiv.find('ul').css({
    "display": "none",
    "position": "relative",
    "width": "100%",
    "height": "100%",
    "height": "100%",
});

// 判断 是否有点击事件
if(HasPaging == true) {
    // 遍历添加当前的length为 0 
    for(var k = 0; k <= Barray.length; k++) {
        _this.alength = 0;
        _this.Arr.push(_this.alength);
    }

    // 做点击事件
    for(var b = 0; b < Barray.length; b++) {


        (function(arg) {
            // 为按钮做点击函数
            $("#" + Barray[arg]).click(function() {
                $("#" + name + " ul").css("display", "none");
                $("#" + "test" + arg).css("display", "block");
                $("#" + "test" + arg + " li").eq(0).css("display", "block");
                clearInterval(_this.change);
                Testmove("test" + arg, arg, _this.Arr[arg]);

            })
        })(b)
    }
}

// 让第一个ul 显示出来
$("#" + name + " ul:first").css("display", "block");

// 寻找ul
var lis = oDiv.find('li');

// 寻找img
var Lisimgs = lis.find('img');

// 给图片设置样式
Lisimgs.css({
    "width": "100%",
    "height": "100%",
    "border-radius": "5px",
    "box-shadow": "-3px 4px 7px  #211f1f",
})
// 给li设置样式
lis.css({
    "display": "none",
    "width": "100%",
    "height": "100%",
    "position": "absolute",

    "float": "left",
});
$("#test0 li").eq(0).css("display", "block");

// 定时器轮播
function Testmove(id, length, arlength) {
    _this.change = setInterval(function() {
        arlength++;
        console.log("当前length为：" + arlength);

        // 判断 个数
        if(arlength == array[length].length) {
            arlength = 0;
        }
        showaa(arlength, id);
        console.log("当前id为：" + id);
    }, 2000);
}
Testmove('test0', 0, this.length);

function showaa(length, id) {
    $("#" + id + " li").eq(length - 1).fadeOut(1000); //将上一张图片隐藏
    $("#" + id + " li").eq(length).fadeIn(2000); //将这张图片出现
}

}

代码在上面，每次点击的时候，都是从0开始运动，我需要的是，切换页面的时候，length会记录的。求大神

切换页面是几个意思？。。是指HasPaging 为true时生成的按钮点击后从这个位置开始？那不是更新下length属性，记得把之前的问题结了，明白的继续问就行了

    if (HasPaging == true) {
        // 遍历添加当前的length为 0 
        for (var k = 0; k <= Barray.length; k++) {
            _this.alength = 0;
            _this.Arr.push(_this.alength);
        }

        // 做点击事件
        for (var b = 0; b < Barray.length; b++) {


            (function (arg) {
                // 为按钮做点击函数
                $("#" + Barray[arg]).click(function () {
                    $("#" + name + " ul").css("display", "none");
                    $("#" + "test" + arg).css("display", "block");
                    $("#" + "test" + arg + " li").eq(0).css("display", "block");
                    clearInterval(_this.change);
                    _this.length = arg;//////////////////////////
                    Testmove("test" + arg, arg, _this.Arr[arg]);

                })
            })(b)
        }
    }

用localStorage或者sessionStorage sessionStorage.setItem("key", "value"); key为每一本书的名字，存你的7本书 value每本书的页数，var value = sessionStorage.getItem("key");获取页数

自己进入控制台 console 输出看看 数据是不是都对的 才知道哪一步有问题啊

```DigsurGallery = {};
DigsurGallery.Rolling = function() {
this.change = null;
this.length = 0;
this.Arr = [];
this.alength;
this.barr = [];
this.onindex = 0;

}
// 对象下的一个方法
DigsurGallery.Rolling.prototype.FadeInOut = function(name, HasPaging, array, Barray) {
// 定义一个对象，这个对象对应着DigsurGallery.Rolling
var _this = this;
// 获取 盒子的名字
var oDiv = $('#' + name);
// 遍历数组，创建ul与li，并且赋给Id
for(var i = 0; i < array.length; i++) {
var oUlPageOne = $("

");
oDiv.append(oUlPageOne);
$(oUlPageOne).attr('id', 'test' + i);
for(var l = 0; l < array[i].length; l++) {
var oli = $("");
oUlPageOne.append(oli);
var oImg = $("")
$(oImg).attr('src', array[i][l]);
oli.append(oImg);

    }

}
// 判断 是否有点击事件
if(HasPaging == true) {
    // 做点击事件
    for(var b = 0; b < Barray.length; b++) {
        _this.alength = 0;
        _this.Arr.push(_this.alength);
        (function(arg) {
            //              // 为按钮做点击函数
            $("#" + Barray[arg]).click(function() {

                _this.barr.push(arg);
                _this.onindex = _this.barr[_this.barr.length - 1];
                $("#" + name + " ul").css("display", "none");
                $("#" + "test" + arg).css("display", "block");

                clearInterval(_this.change);
                Testmove("test" + arg, arg, _this.Arr[arg]);
            })
        })(b)
    }
}
// 设置样式
oDiv.find('ul').css({
    "display": "none",
    "position": "relative",
    "width": "100%",
    "height": "100%",
    "height": "100%",
});
// 让第一个ul 显示出来
$("#" + name + " ul:first").css("display", "block");

// 寻找ul
var lis = oDiv.find('li');

// 寻找img
var Lisimgs = lis.find('img');

// 给图片设置样式
Lisimgs.css({
    "width": "100%",
    "height": "100%",
    "border-radius": "5px",
    "box-shadow": "-3px 4px 7px  #211f1f",
})
// 给li设置样式
lis.css({
    "display": "none",
    "width": "100%",
    "height": "100%",
    "position": "absolute",
    "float": "left",
});

for(var kk = 0 ;kk< array.length;kk++){
    $("#test" +kk).find("li:first-child").css("display","block");
}

// 定时器轮播
function Testmove(id, length, arlength) {
    _this.change = setInterval(function() {
        arlength++;
        // 判断 个数
        if(arlength == array[length].length) {
            arlength = 0;
        }
        _this.Arr[_this.onindex] = arlength;
        showaa(arlength, id);
    }, 2000);

}
    Testmove('test0', 0, this.length);

function showaa(length, id) {
    $("#" + id + " li").eq(length - 1).fadeOut(1000); //将上一张图片隐藏
    $("#" + id + " li").eq(length).fadeIn(2000); //将这张图片出现
}

}

还能在优化吗？帮看看，谢谢

 <!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>封装函数</title>
    </head>
    <style>
        *{margin: 0;padding: 0;}
        li{list-style: none;}
        .FadeInShuffling{width: 100%;margin: 0 auto;height:200px;position: relative;}
    </style>
    <body>
        <div id="page1" class="page FadeInShuffling">
            <input type='button' id='b1' value='1'>
            <input type='button' id='b2' value='2'>
            <input type='button' id='b3' value='3'>
            <input type='button' id='b4' value='4'>
            <input type='button' id='b5' value='5'>
            <input type='button' id='b6' value='6'>
            <input type='button' id='b7' value='7'>
        </div>
    </body>
</html>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
    // 创建一个对象 
DigsurGallery = {};
// 对象下的一个属性
DigsurGallery.Rolling = function() {
    // 定时器名字
    this.change = null;
    // length长度,定时器运动的时候做判断
    this.length = 0;
    this.Arr = [];
    this.alength;
    this.barr = [];
    this.onindex = 0;

}
// 对象下的一个方法
DigsurGallery.Rolling.prototype.FadeInOut = function(name, HasPaging, array, Barray) {
    // 定义一个对象，这个对象对应着DigsurGallery.Rolling
    var _this = this;
    // 获取 盒子的名字
    var oDiv = $('#' + name);
    // 遍历数组，创建ul与li，并且赋给Id
    for(var i = 0; i < array.length; i++) {
        var oUlPageOne = $("<ul></ul>");
        oDiv.append(oUlPageOne);
        $(oUlPageOne).attr('id', 'test' + i);
        for(var l = 0; l < array[i].length; l++) {
            var oli = $("<li></li>");
            oUlPageOne.append(oli);
            var oImg = $("<img />")
            $(oImg).attr('src', array[i][l]);
            oli.append(oImg);

        }

    }

    // 判断 是否有点击事件
    if(HasPaging == true) {
        // 做点击事件
        for(var b = 0; b < Barray.length; b++) {
            _this.alength = 0;
            _this.Arr.push(_this.alength);
            (function(arg) {
                // 为按钮做点击函数
                $("#" + Barray[arg]).click(function() {
                    _this.barr.push(arg);
                    _this.onindex = _this.barr[_this.barr.length - 1];
                    $("#" + name + " ul").css("display", "none");
                    $("#" + "test" + arg).css("display", "block");
                    clearInterval(_this.change);
                    Testmove("test" + arg, arg, _this.Arr[arg]);
                })
            })(b)
        }
    }
    // 设置样式
    oDiv.find('ul').css({
        "display": "none",
        "position": "relative",
        "width": "100%",
        "height": "100%",
        "height": "100%",
    });
    // 让第一个ul 显示出来
    $("#" + name + " ul:first").css("display", "block");

    // 寻找ul
    var lis = oDiv.find('li');

    // 寻找img
    var Lisimgs = lis.find('img');

    // 给图片设置样式
    Lisimgs.css({
        "width": "100%",
        "height": "100%",
        "border-radius": "5px",
        "box-shadow": "-3px 4px 7px  #211f1f",
    })
    // 给li设置样式
    lis.css({
        "display": "none",
        "width": "100%",
        "height": "100%",
        "position": "absolute",
        "float": "left",
    });

    for(var kk = 0; kk < array.length; kk++) {
        $("#test" + kk).find("li:first-child").css("display", "block");
    }

    // 定时器轮播
    function Testmove(id, length, arlength) {
        _this.change = setInterval(function() {
            arlength++;
            // 判断 个数
            if(arlength == array[length].length) {
                arlength = 0;
            }
            _this.Arr[_this.onindex] = arlength;
            FadeInOut(arlength, id);
        }, 2000);

    }
    Testmove('test0', 0, this.length);

    function FadeInOut(length, id) {
        $("#" + id + " li").eq(length - 1).fadeOut(1000); //将上一张图片隐藏
        $("#" + id + " li").eq(length).fadeIn(2000); //将这张图片出现
    }

}





    var array = new Array();
    array[0] = ["Image/1.jpg", "Image/2.jpg", "Image/3.jpg", "Image/4.jpg", "Image/5.jpg", "Image/6.jpg", "Image/7.jpg"];
    array[1] = ["Image/7.jpg", "Image/6.jpg", "Image/5.jpg", "Image/4.jpg", "Image/3.jpg", "Image/2.jpg", "Image/1.jpg"];
    array[2] = ["Image/1.jpg", "Image/6.jpg", "Image/5.jpg", "Image/4.jpg", "Image/3.jpg", "Image/2.jpg", "Image/7.jpg"];
    array[3] = ["Image/7.jpg", "Image/6.jpg", "Image/5.jpg", "Image/4.jpg", "Image/3.jpg", "Image/2.jpg", "Image/1.jpg"];
    array[4] = ["Image/1.jpg", "Image/6.jpg", "Image/5.jpg", "Image/4.jpg", "Image/3.jpg", "Image/2.jpg", "Image/7.jpg"];
    array[5] = ["Image/7.jpg", "Image/6.jpg", "Image/5.jpg", "Image/4.jpg", "Image/3.jpg", "Image/2.jpg", "Image/1.jpg"];
    array[6] = ["Image/1.jpg", "Image/6.jpg", "Image/5.jpg", "Image/4.jpg", "Image/3.jpg", "Image/2.jpg", "Image/7.jpg"];
    var Barray = ['b1','b2','b3','b4','b5','b6','b7'];
//  array[2] = ["Image/7.jpg", "Image/6.jpg", "Image/5.jpg", "Image/4.jpg", "Image/3.jpg", "Image/2.jpg", "Image/1.jpg"];
    var FadeIn1 = new DigsurGallery.Rolling(Barray);

    FadeIn1.FadeInOut('page1',false,array,Barray);


</script>