салфетка открывает неправильное изображение после применения фильтра

После того, как я применяю фильтр (устанавливая некоторые изображения так, чтобы они не отображались в зависимости от имен классов). Photoswipe открывается в соответствии с порядковым номером, который изначально был у каждого изображения. Массив, из которого извлекается фотография, обновляется и включает только отфильтрованные изображения. Однако значение индекса, на которое указывает каждое изображение, не обновляется.

Если изображение было элементом 5 в нефильтрованной галерее и номером 1 в фильтрованной галерее, после применения фильтра щелчок по этому изображению откроет изображение номер 5 в фильтрованной галерее.

Это мой код, который устанавливает массив:

getFigures = function() {
var filteredFigures = [];
$pic.find('figure:visible > a').map(function() {
var $href = $(this).attr('href'),
$size = $(this).data('size').toString().split('x'),
$width = $size[0],
$height = $size[1];

                var figures = {
                    src : $href,
                    w   : $width,
                    h   : $height
                };
                filteredFigures.push(figures);
            });
            return filteredFigures;
        };

Это мой код, который выбирает индекс и открывает очистку фотографий:

    $pic.on('click', 'figure', function(event) {
    event.preventDefault();

         filteredFigures = getFigures();
            $.map(filteredFigures, function(index, value) {
            image[index]     = new Image();
            image[index].src = value['src'];
        });
            var $index = $(this).index();
            var options = {
                index: $index,
                bgOpacity: 0.8,
                showHideOpacity: true
            }

            var lightBox = new PhotoSwipe($pswp, PhotoSwipeUI_Default, filteredFigures, options);
            lightBox.init();

Заранее благодарю за любую помощь!


jquery jquery-isotope photoswipe
person Badetv    schedule 05.05.2018    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Одно из решений - не открывать изображение по его порядковому номеру, потому что именно там и происходит несоответствие. Используйте что-нибудь еще: у объекта есть ключ «src», значение которого совпадает с href изображения, на которое вы нажимаете. Так что используйте это, чтобы открывать картинки

Код для открытия чтения фотографий работает следующим образом:

        $pic.on('click', 'a', function(event) {
        event.preventDefault();
        filteredFigures = getFigures();

    var clickedAHref = ($(this).attr('href'));
    console.log(clickedAHref);
    var matchedIndex = filteredFigures.map(function (obj) { return obj.src; }).indexOf(clickedAHref);


        var $index = $(this).index();
        var options = {
            index: matchedIndex,
            bgOpacity: 0.8,
            showHideOpacity: true
        }

        var lightBox = new PhotoSwipe($pswp, PhotoSwipeUI_Default, filteredFigures, options);
        lightBox.init();
    });
person Badetv    schedule 14.05.2018