javascript - 刷新时图像变化的顺序

Question

编辑:发现错误并修复它，而不是 colors.length，它应该是 theImages.length。感谢那些提供帮助的人。

每次刷新页面时，我一直在使用一个数组来按顺序更改我博客上的某些图像，我遇到了一个问题。例如，当您刷新我的页面时，图像 1A、1B 和 1C 变为 2A、2B 和 2C，依此类推。在使用这个数组为我的博客制作了大约 4 个不同的主题后，我正在制作一个包含 6 个不同图像的主题，这比我通常使用的要多。图像只有一组备用，因此当您刷新时，它会在各组之间来回切换。但是，图像在刷新时已停止更改，我坚持使用 this对于我的主题，当它应该在刷新时改变。有谁知道如何解决它？我附上了我使用过的代码，如果有人可以提供帮助，我将不胜感激。

<script type="text/javascript">

            function refreshSequence() {

            //get current cookie value
            var currentIndex = parseInt(getCookie());

            //get image object
            var myImg = document.getElementById('SidebarIcon');

            //declare image directory path and image array
            var thePath = "https://";
            var theImages = ["31.media.tumblr.com/99731e8e83fb073cf39c9384137d9c1f/tumblr_inline_nesxwvNhwO1ql0f75.png", "31.media.tumblr.com/eb31394be711bc9acaae672d81dc979d/tumblr_inline_nesxx2Ay3R1ql0f75.png"]

            var imgPath = thePath + theImages[currentIndex];
            myImg.src = imgPath;

            //get image object
            var myImg = document.getElementById('SidebarPixel');

            //declare image directory path and image array
            var thePath = "https://";
            var theImages = ["31.media.tumblr.com/3c74b0cddf6eea3b464d2d1a7f34e597/tumblr_inline_nesxwgSnSv1ql0f75.png", "31.media.tumblr.com/de88145e72ccb2987d323f4ff8a607d8/tumblr_inline_nesxl0LzRO1ql0f75.png"]

            var imgPath = thePath + theImages[currentIndex];
            myImg.src = imgPath;

             //get image object
            var myImg = document.getElementById('SidebarGIF');

            //declare image directory path and image array
            var thePath = "http://";
            var theImages = ["static.tumblr.com/v2omgmu/bNEnejyu1/terrabg.gif", "static.tumblr.com/v2omgmu/SoXner1tt/terrabg2.gif"]

            var imgPath = thePath + theImages[currentIndex];
            myImg.src = imgPath;

            //get image object
            var myImg = document.getElementById('SidebarBG');

            //declare image directory path and image array
            var thePath = "http://";
            var theImages = ["static.tumblr.com/v2omgmu/LKZnelu4o/background.png", "http://static.tumblr.com/v2omgmu/1DTnesy9e/backgroundthang.png"]

            var imgPath = thePath + theImages[currentIndex];
            myImg.src = imgPath;

            //get image object
            var myImg = document.getElementById('NavIcon');

            //declare image directory path and image array
            var thePath = "https://";
            var theImages = ["31.media.tumblr.com/7b5bc574d9d829df1091687ed4fda3af/tumblr_inline_nesxxnEn5S1ql0f75.png", "31.media.tumblr.com/c083dc983293f5f37d5f827c636ca93f/tumblr_inline_nesxxyNUWz1ql0f75.png"]

            var imgPath = thePath + theImages[currentIndex];
            myImg.src = imgPath;

            //get image object
            var myImg = document.getElementById('SideThing');

            //declare image directory path and image array
            var thePath = "http://";
            var theImages = ["static.tumblr.com/v2omgmu/bgOnesvtn/terrasidething1.png", "static.tumblr.com/v2omgmu/y9nnesvuq/terrasidething2.png"]

            var imgPath = thePath + theImages[currentIndex];
            myImg.src = imgPath;

            //set next cookie index
            currentIndex += 1;
            currentIndex %= colors.length;
            setCookie(currentIndex);
        }

        function setCookie(someint) {
            var now = new Date();
            var addDays = now.getDate() + 7
            now.setDate(addDays); // cookie expires in 7 days
            var theString = 'imgID=' + escape(someint) + ';expires=' + now.toUTCString();
            document.cookie = theString;
        }

        function getCookie() {
            var output = "0";
            if(document.cookie.length > 0) {
                var temp = unescape(document.cookie);
                temp = temp.split(';');
                for(var i = 0; i < temp.length; i++) {
                    if(temp[i].indexOf('imgID') != -1) {
                        temp = temp[i].split('=');
                        output = temp.pop();
                        break;
                    }
                }
            }
            return output;
        }

</script>

<body onload="refreshSequence();">

<img id="SidebarIcon">
<img id="SidebarGIF"> etc etc

Answer 1

Chrome 开发者工具显示你有这一行:

document.body.style.backgroundColor = background;

并且您没有定义变量 background，因此代码中断。你删除这条线。 对于 cookie 操作，最好使用 MDN 的 library .