Я хочу получить Источник изображения от слайдера?


Я хочу получить текущий Источник изображения из слайдера. когда его слайды, что Источник изображения должен быть захвачен в текстовом поле, но он принимает только первое изображение src и не принимает последующие изображения. Я использую плагин pgwSlideshow..

HTML-код,

<div class="cartBgclr">
    <a href="#cart" onclick="addToCart(this)">
        <div class="enqry-cart enqry-cart1 pull-left">
            <i class="fa fa-shopping-cart pull-left" aria-hidden="true"></i>
            <span class="pull-left">add to enquiry cart</span>
            <input type="text" name="image-path" class="image-path" value="" />
        </div>
        <h4 style="display:none;">Sandstone</h4>
    </a>
            </div>

<div class="row">
    <div class="col-sm-12">
        <ul class="pgwSlideshow add-to-cart">
            <li><img src="images/sandstone/sandstone1.jpg" alt="" /></li>
            <li><img src="images/sandstone/sandstone2.jpg" alt="" /></li>
            <li><img src="images/sandstone/sandstone3.jpg" alt="" /></li>
            <li><img src="images/sandstone/sandstone4.jpg" alt="" /></li>
            <li><img src="images/sandstone/sandstone5.jpg" alt="" /></li>
            <li><img src="images/sandstone/sandstone6.jpg" alt="" /></li>
        </ul>
    </div>
    <div class="pd20"></div>
</div>

Код Jquery,

var imgSrc = $('.pgwSlideshow').find('img').attr('src');
console.log(imgSrc);
2 2

2 ответа:

Вам нужно получить атрибут с помощью метода setInterval (). Поскольку длительность интервала слайд-шоу по умолчанию составляет 3 с, установите 3000ms delay в setInterval

setInterval(function(){
  var imgSrc = $(".ps-selected > img").attr("src");
  console.log(imgSrc);
}, 3000);

Проблема здесь заключается в том, что в jQuery некоторые методы работают с массивами в режиме get, а другие-только с отдельными элементами. Метод attr является одним из таких методов, в документации говорится:

Получить значение атрибута дляпервого элемента в наборе сопоставленных элементов.

(Курсив мой собственный)

Поэтому в этом примере он всегда будет возвращать только src первого элемента в наборе, возвращаемом find.

В pgwslideshow плагин устанавливает все слайды, кроме "текущего" слайда, чтобы быть display: none, так что вы должны быть в состоянии фильтровать по этому, чтобы получить src для "текущего" слайда, что-то вроде:

var imgSrc = $('.pgwSlideshow').find('li').filter(':visible').find('img').attr('src');

Вы также можете использовать собственный API плагина для этого - он имеет метод getCurrentSlide, который возвращает индекс текущего слайда. Если вы использовали это в функции afterSlide, Вы должны быть в состоянии получить src текущего изображения.