使用jQuery访问图像的src属性

Question

我在以下示例中进行跟踪：

http://bxslider.com/examples/perform-action-transition-callback

但是通过这个例子，我可以从当前图像中获取索引号。

我有以下代码：

 $('#preview_images_gallery').bxSlider({
                                        onAfterSlide: function(totalSlides, currentSlide){
                                                                                            var src = $('currentSlide').attr('src');
                                                                                            $('.preview .bx-wrapper .bx-window').append('<p class="check">' + src);
                                                                                         }
                                      });

如何获取当前图像的src属性？

我写：

var src = $(currentSlide).attr('src');

但是我不确定！

谢谢！

Answer 1

查看API

onBeforeSlide / onAfterSlide在下面都使用相同的签名，您可以在第3个参数中访问slide对象。 您可以从此处获取幻灯片内容的详细信息

function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject){
  // perform actions here
}

Answer 2

var source = $('img').attr('src');

没有经过测试，效率也不高，但是类似的方法可能会起作用，可能需要进行一些调整。

var images = [], source="";
$('#slider1').bxSlider({
    pager: true,
    onBeforeSlide: function(currentSlide, totalSlides){
       $('img', this).each(function() {
           images.push(this);
       });
       source = $(images[currentSlide]).attr('src');
    }
});
alert(source);

如果宏正确，则为：

$('#slider1').bxSlider({
        pager: true,
        onBeforeSlide: function(currentSlide, totalSlides, SlideObject){
            source = SlideObject.attr('src');
        }
    });
    alert(source);

Answer 3

要获取任何jquery元素的属性，可以使用以下方法：

$('.selector').attr(attrName);

就您而言，像这样...

$('.slider1 .left').find('img').attr('src');

甚至更多：

jQuery('#slider1').find('li.pager:nth-child(currentSlide)').attr('src');

您将必须自己找到最优雅的方式，但是所有建议使用.attr(attrName)的答案都是正确的，您只需要找到正确的元素选择器即可。

Answer 4

这将取决于您的实际html标记，但是假设您使用li元素来创建幻灯片，则下面应该可以解决问题（slider1是容器ol / ul id）

$($('#slider1 li')[currentSlide - 1]).find('img').attr('src');

本质上，我们使用索引（currentSlide-1）来查找slide（li）元素，然后在幻灯片中查找图像以获取其source属性。 现在，如果幻灯片中有多个图像，则上面的图像可能无法正常工作。

Answer 5

试试这个可能对你有帮助

document.getElementById("currentSlide_id").src;



var src= $('currentSlide_id').attr('src')

Answer 6

怎么样

$('#sliderContainer').children().eq(currentSlide).find('img').attr('src')

在链接的示例中，这将是

$('#slider1').children().eq(currentSlide).find('img').attr('src')