JQuery показать div с другой страницы

Question

У меня есть проблема, которую трудно объяснить, но я попробую:

У меня есть страница, которая исчезает и исчезает с некоторых divs, взятых с других страниц, с функцией load() при событии щелчка. Одна из этих divs содержит подборку изображений, показанных с использованием Jquery.Cycle. Хотя на самой странице jquery.Cycle работает нормально, при импорте на страницу - нет. Надеюсь, мое объяснение понятно.

Код для импорта следующий:

$('#wrapper a').live("click", function(evt) {

    evt.preventDefault();

    var url = $(this).attr('href');
    var oldDiv = $('#wrapper-content');
    var newDiv = $('#wrapper-content1').load(url + ' #wrapper-content');
    newDiv.hide();
    $('#wrapper-mid-in-right').prepend(newDiv);
    newDiv.fadeIn(1000);
    oldDiv.fadeOut(1000,function() {

    $(this).remove();
    });

});

Как уже говорилось, эффект цикла работает нормально на странице. Пожалуйста, помогите мне. F.

$('#gallery').cycle({
fx: 'scrollRight',
timeout: 100000,
speed: 500,
delay: -2000,
pager: '#pager'

});

Answer 1

Я считаю, что ваша проблема не имеет никакого отношения к блоку кода, который вы разместили.Плагин работает на самой странице из-за нескольких вещей:

1. загружен плагин Cycle
2. разметка уже существует
3. плагин инициирован соответствующим образом ($(document).ready() и т. Д.)

При динамической загрузке этого содержимого на страницу ни один из этих фактов не может быть правдой.

1. Загружается ли на этой странице плагин Cycle?
2. Вы должны запустить плагин Cycle после того, как импортировали новую разметку.

JS на родительской странице (странице, загружающей содержимое Cycle) должен быть чем-топримерно как:

$('#wrapper-content1').load(url + ' #wrapper-content', function() {
    $('#gallery').cycle({
        fx: 'scrollRight',
        timeout: 100000,
        speed: 500,
        delay: -2000,
        pager: '#pager'
    });
});

Answer 2

попробуй вот так

$('#wrapper a').live("click", function(evt) {

    evt.preventDefault();

    var url = $(this).attr('href');
    var oldDiv = $('#wrapper-content');
    var newDiv = $('#wrapper-content1').load(url + ' #wrapper-content');
    newDiv.hide();
    $('#wrapper-mid-in-right').prepend(newDiv);
    newDiv.fadeIn(1000);
    oldDiv.fadeOut(1000,function() {

    $(this).remove();
    });


    $('#gallery').cycle({
        fx: 'scrollRight',
        timeout: 100000,
        speed: 500,
        delay: -2000,
        pager: '#pager'

     });

});

Answer 3

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

function cycleFunction(){
 // implement cycle functionality here
}

$(document).ready(function(){
   cycleFunction(); // calling function for 1st time

   $('#wrapper a').on("click", function(evt) {    
    evt.preventDefault();

    var url = $(this).attr('href');
    var oldDiv = $('#wrapper-content');
    var newDiv = $('<div>').attr('id','wrapper-content1'); // create the div with id
    $('#wrapper-mid-in-right').prepend(newDiv); include in the existing div
    $('#wrapper-content1').load(url + ' #wrapper-content', function(){
      cycleFunction(); // calling function everytime div load
    }); // load the new div
  });    
});