0

我正在使用幻灯片 2 (http://www.electricprism.com/aeron/slideshow/) 在我的网站上显示几张图片,问题是图片数量和它们的位置应该硬编码到 javascript 代码中。

我想使用一个数组(来自 php 文件输出)并以某种方式为“var data”分配新值,以便显示文件夹中的所有图像,而无需每次手动更新。有任何想法吗?

<script>
        window.addEvent('domready', function(){


            var data = { '5.jpg': { caption: '1' }, '2.jpg': { caption: '2' }, '3.jpg': { caption: '3' }, '4.jpg': { caption: '4' }};

            new Slideshow('overlap', data, { captions: { delay: 1000 }, delay: 3000, height: 300, hu: 'images/', width: 400 });

        });
    </script>
4

1 回答 1

0

如果您使用 PHP,那么您可以轻松地做到这一点。

比如说,你有逻辑将所有文件放入一个如下所示的数组中:

$foo = Array("2.jpg" => "2", "3.jpg" => "3");

代表文件名和标题

然后你可以这样做:

<?php echo json_encode($foo); ?>

输出它。

如果要在 js 块中将其输出到变量中:

var data = <?php echo json_encode($foo); ?>;

它实际上应该呈现为:

var data = [{"2.jpg": "2"},{"3.jpg": "3"}];

另外,请记住,在您的示例中,您实际上并没有使用数组,而是使用了对象。有很大的不同。在输出中,我建议您将获得一个对象数组。你会像这样循环它:

Array.each(data, function(img) {

});

但是因为你的键是动态的,所以迭代很困难,你需要Object.eachorObject.keysfor (var key in obj) {}获取属性。更好的数据结构是:

$foo = Array(Array("name" => "2.jpg", "caption" => "two"), Array("name" => "3.jpg", "caption" => "three"));

这意味着在您的 js 循环中,您可以参考:

Array.each(data, function(img) {
    img.name; // filename
    img.caption; // title    
});
于 2012-04-12T09:11:44.943 回答