Динамически добавленные элементы не загружаются в мой слайдер jQuery - PullRequest
2 голосов
/ 29 июля 2011

Моя страница в настоящее время использует Слайды

Я хочу иметь возможность динамически добавлять новые «слайды» в мой слайдер. Я делаю это через XML-документ, который содержит ссылку на «слайд-изображение» и ссылку.

Мой код jQuery для динамического добавления элементов таков:

jQuery.ajax({
    type: "GET",
    url: "xml/slider_non_flash_images.xml",
    dataType: "xml",
    success: function(xml) {
        jQuery(xml).find('image').each(function() {
            var imagesrc = jQuery(this).find('src').text();
            var url = jQuery(this).find('href').text();
            var item = '<div><a href="' + url + '"><img src="' + imagesrc + '"/></a></div>';
            jQuery('.slides_container').append(item);
        });
    }
});

Это все работает и добавляет div к слайдам, содержащим div. Проблема в том, что слайд не работает.

Если я сам жестко закодирую элементы <div> внутри контейнера, они загружаются просто отлично.

Может ли это быть проблемой "времени"? Где элементы загружаются после того, как бегунок пытается запуститься? И если так, как я могу добавить их до. Все это происходит в методе (document).ready. Есть что-то раньше?

Спасибо.

Я уверен, что кто-то спросит, поэтому вот код для запуска слайдера.

jQuery('#slides').slides({
    preload: true,
    preloadImage: 'images/loader.gif',
    play: 8000,
    effect: 'fade',
    pause: 15250000,
    slideSpeed: 8000,
    crossfade: true,
    fadeEasing: "easeOutQuad",
    hoverPause: true
});

Ответы [ 2 ]

3 голосов
/ 29 июля 2011

Большинство ползунков сканируют DOM на предмет наличия в настоящее время только элементов загрузки. Если DOM изменяется (то есть динамически с ajax), вам, возможно, придется повторно инициализировать ползунок. Как это сделать, будет отличаться для каждого плагина слайдера.

Вы можете попробовать поместить в функцию вызов $ ('# sliders'). Slides (...), вызвав эту функцию при загрузке страницы, а затем повторно вызывая эту функцию всякий раз, когда DOM изменяется с помощью ajax.

1 голос
/ 29 июля 2011

проверьте http://api.jquery.com/live для более подробной информации о функции live

...