Question

这是我在这里的第一篇文章，我希望能够清楚地了解从$ .getJSON调用中检索数据然后将数据移动到数组中的问题。请注意，我对javascript和jQuery相对较新，所以如果我的代码看起来组织不正确，那只是缺乏经验。

我有一个函数可以加载一个主容器，其中包含一系列div元素，这些元素的名称来自我的计算机，特别是包含图像的文件夹。我目前有8个不同的图像文件夹，该功能加载主容器，div代表这些文件夹，但容器设置为只显示6个文件夹。

我在下面的代码中尝试完成的是各种各样的幻灯片，当用户点击箭头（左或右）时，这些框只是css样式的div，向左滑动或者离开屏幕，从另一侧装入一个新盒子。正确工作时，包含div将显示6个文件夹。

我遇到的问题是，在箭头单击时，我检索数据，然后使用foldernames填充一个新数组。然后我使用shift并推动移动数组元素。然后，当需要使用移位数组重新填充主容器时，我将丢失文件夹名称。

所以在第一个for循环中，foldernames将是例如（＆＃34;我的假期照片＆＃34;，＆＃34;生日照片＆＃34;等等。）

然后我执行shift和push然后设置一个新的for循环来重新填充主容器，但此时foldernames又回来了（＆＃34; 0＆＃34;，＆＃34; 1＆＃34 ;，＆＃34; 2＆＃34;等...）

关于为什么会发生这种情况的任何想法？

$(document).on('click', '#leftarrow', function ()
        {
            $('.imageFolders').animate({ left: "-=175px" }, 750);

            var jsonFile = 'http://www.johndavidhock.net/views/about/json/jsonObject.json';
            $.getJSON(jsonFile, function (data)
            {
                var folderArray = [];

                setTimeout(function ()
                {
                    for (var foldername in data)
                    {
                        folderArray.push(foldername);
                        //foldername is coming back correctly, i.e. "My Vacation Photos", "Birthday Photos", etc..
                    }

                    var x = folderArray.shift();
                    folderArray.push(x);

                    var destination = $('#masterNavigator');
                    destination.html("");
                    for (var foldername in folderArray)
                    {
                        destination.append('<div id="' + foldername + '" class="imageFolders" ;>' + foldername + '</div>');
                        //foldername is coming back incorrectly, i.e. "0", "1", etc..
                    }
                }, 600);
            });
        });

Javascript函数和异步调用

0 个答案: