Как повторно запустить скрипт для определённого div блока, при изменении в нём содержимого другим скриптом?

Question

[Tutucu]

На странице выводятся анонсы записей, скрипт на этой же странице создаёт выравнивание элементов, чтобы они заполняли всё пространство страницы, под записями находится кнопка - "Показать ещё...". При нажатии на неё происходит ajax запрос, при котором к старым записям добавляется порция следующих постов, но есть одна проблема - тот скрипт, что выравнивает элементы, не выравнивает новые элемента, что портит всю картину. Все скрипты - разные, и находятся в разных библиотеках. Как решить подобную задачу? Можно ли как-то задать скрипту, чтобы он срабатывал при любом изменении страницы? Или может можно, указать этот скрипт в succes ajax запроса? Тогда как можно подключить библиотеку примо в файл js?

Answer 1

[Денис]

Можно и при любом изменении страницы (на то есть MutationObserver), но вариант не кроссбраузерный. Поэтому, лучше в success реализовать. Если используете плагин для распределения контента, то посмотрите документацию на предмет "переинициализации", а если код ваш, то просто "запакуйте" его в функцию и вызывайте после успешного завершения запроса и вывода контента на страницу.

Comments

[Tutucu]

Перечитал документацию, ничего не указано по переинициализации. Нет ли какого-то общего решения?

[Денис]

Tutucu а можете ссылочку на этот плагин дать?

[Tutucu]

Конечно: miromannino.github.io/Justified-Gallery

[Денис]

Tutucu да, у него что-то вроде refresh и т.д. не предусмотрено. Раз вы используете jQuery, то можно воспользоваться методом $.ajaxSetup(). Инициализацию плагина запаковываем в функцию, которую будем вызывать после завершения любого ajax-запроса:

function myPlugin() {
    $('selector').justifiedGallery({
        /* options */
    });
}
$.ajaxSetup({
	complete: myPlugin
});

Хочу обратить внимание на то, что функция будет вызываться не после удачно завершенного запроса, а по окончанию любого, даже того, что будет завершен с ошибкой. Хотя, это не должно повлиять глобально. Кроме того, если в каком-то ajax-запросе, вы будете использовать callback-функцию complete, то естественно, что она затрёт описанную в $.ajaxSetup(). Об этом надо просто помнить.

[Tutucu]

Денис: Огромное спасибо!