Galleria Slideshow api - 查找当前图像的替代文本

Question

我正在一个网站上实现 Galleria 幻灯片，并且大部分情况下它运行良好。 在 div 中（我现在只是登录到 firebug 控制台）

这是我编写的脚本：

<script type="text/javascript">
    Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
    $("#gallery").galleria({
        width: 420,
        height: 370,
        autoplay: 5000, // will move forward every 5 seconds
        extend: function(options) {
            var gallery = this; // "this" is the gallery instance

            this.bind("loadstart", function(e) {
                var currImg = gallery.getActiveImage();
                var altText = $(currImg).attr('alt');
                console.log(altText);
            });
        }
    });
</script>

我正在使用 api 来自定义幻灯片的外观，我想从图像中获取替代文本并显示 这会起作用，但我在控制台中得到“未定义”。有谁知道如何从“Galleria”图像中获取替代文本？ API 文档说 .getActiveImage() 方法返回一个返回 IMG 元素，因此我不确定我是否以正确的方式使用 IMG 元素，或者它是否具有可供我抓取的替代文本。

我还尝试使用我的图像 ID，但这

('slideshow_image_' + e.index)

也在日志中给了我一个未定义的结果。

我知道 HTML 中有一个名为 Slideshow_image_0 等的元素，我认为通过元素 ID 找到替代文本并显示它会很容易。如果我查看 firebug 的 HTML 选项卡，整个 div 完全不同，并且图像由 galleria 动态填充到各个部分中。不知道该怎么办...请帮忙！

Answer 1

您需要绑定一个在图像更改时调用的方法。

而且 getActiveImage() 并不像 getData 那样有用。下面的代码在控制台中打印您想要的 ALT 和标题，以防万一您需要。

试试这个：

$("#gallery").galleria({
        width: 420,
        height: 370,
        autoplay: 5000, // will move forward every 5 seconds
        extend: function(options) {
            var gallery = this; // "this" is the gallery instance

            this.bind(Galleria.IMAGE, function(e) {
                var current = gallery.getData(gallery.getIndex());
                var currImg = current.original;
                var altText = $(currImg).attr('alt');
                console.log(altText, current.title);
            });
        }
    });