PhotoSwipe: заполнить/переключить галерею изображений из локального хранилища?

Я решал эту проблему два дня и никак не мог заставить ее работать. Вы можете найти все файлы, упомянутые здесь, в этом ZIP-файле: http://mtiaz.com/help/help.zip

В файле «./js/custom.photos.js» я вызываю Ajax для получения данных JSON с сайта WordPress. В функции успеха я делаю несколько вещей:

  1. Прокрутите все полученные данные и сохраните все вложения к сообщению, возвращенные в объекте JSON в localStorage через переменную «attachments_gallery» (от 14 до 17 вложений к сообщению).

  2. Добавляйте одно изображение к сообщению (которое представляет каждую галерею photoSwipe)

  3. Элемент div #overlay, содержащий динамически создаваемые галереи, по умолчанию скрыт. Когда пользователь щелкает один из эскизов галереи, он должен отображаться поверх всего и включать изображения галереи в неупорядоченный список. Этот список получен из предыдущих транзакций localStorage.

Теперь проблема начинается с получения следующей ошибки в console.log:

Uncaught TypeError: Не удается прочитать свойство «Util» неопределенного кода.photoswipe.noutil.jquery-3.0.5.js:26

Независимо от того, использую ли я уменьшенный или исходный скрипт, я получаю эту ошибку. Несмотря на это, первоначальные миниатюры загружаются в поле зрения через AJAX. Однако, когда я нажимаю на любой из них, я получаю следующую ошибку:

Uncaught TypeError: Object [object Object] не имеет метода «photoSwipe» custom.photos.js: 157

Я просто не могу пройти мимо этих двух проблем. Кто-нибудь может мне помочь? Спасибо!

ОБНОВЛЕНИЕ СКРИПКИ JS

http://jsfiddle.net/Z6V4p/8/

photoSwipe

json jquery ajax local-storage photoswipe
person halkibsi    schedule 13.11.2013    source источник
comment
Можно ли воспроизвести сценарий в JS Fiddle?   -  person Purus    schedule 13.11.2013
comment
вот: jsfiddle.net/Z6V4p/8   -  person halkibsi    schedule 13.11.2013
comment
В локальном хранилище хранится следующее значение: ‹li›‹a href=\ndcye.org /wp-content/uploads/ndc11-2013_1.jpg\›‹img src=\ndcye.org/wp-content/uploads/ndc11-2013_1.jpg\ alt=\\ /›‹/a›‹/li›.. проверьте этот формат   -  person Purus    schedule 13.11.2013
comment
Да, Пурус... это правильно. Затем он извлекается для заполнения #Gallery ul, а затем назначается ему photoSwipe. Я делаю это неправильно?   -  person halkibsi    schedule 13.11.2013
comment
Я пытаюсь понять, что вы на самом деле хотели сделать с изображениями ... просто реализовать простую фотосъемку или какое-то специальное требование? дайте мне знать.   -  person Purus    schedule 13.11.2013
comment
простой динамический фотосвайп, не более того. спасибо за вашу помощь Пурус. Я очень ценю это.   -  person halkibsi    schedule 13.11.2013
comment
Хорошо .. Я посмотрю и вернусь к вам .. Но мне интересно, почему вы используете для них локальное хранилище .. в этом нет необходимости, если вы хотите просто динамическую фотосъемку .. просто войдите в вызов ajax и отобразите их   -  person Purus    schedule 13.11.2013

Ответы (1)


arrow_upward
0
arrow_downward

Пожалуйста, попробуйте приведенную ниже скрипту. Я изменил это в соответствии с вашим требованием. Используйте вызов ajax для получения изображений и отображения с помощью фотосмахивания.

Стиль его соответственно, как вам нужно. Для простоты я не применял никаких стилей.

http://jsfiddle.net/Purus/vBvLK/3/

Простой приведенный ниже код творит чудеса.

var $s = $("#gridView a").photoSwipe();
person Purus    schedule 13.11.2013
comment
вы решили мою проблему косвенно. В своем собственном JSFiddle вы использовали v3.0.4... когда я переключился на ту же версию, все заработало!! :) Думаю, это ошибка версии 3.0.5. Как я могу: (1) поблагодарить вас? (2) сообщить об этом? - person halkibsi; 14.11.2013
comment
Вы можете сообщить о проблеме на странице github.com/codecomputerlove/PhotoSwipe/issues. помочь тебе. Дайте мне знать, если вам нужна другая информация. - person Purus; 14.11.2013