在ajax加載的內容上加載jquery循環

Question

我正在嘗試在ajax加載的內容上加載插件Jquery Cycle，但是我收到此錯誤並且它似乎不起作用：

“[循環]終止;選擇器找到的零元素”

這是loader.js：

$(document).ready(function(){

// load home when the page loads
$("#content").load("home.html", function(){
  $(this).fadeIn("slow");
});

// load artworks page
$("#artworks > a").click(function(){
    $("#content").hide();
    $("#content").load("artworks.html", function(){
        $(this).fadeIn("slow");
    });
});

    // load projects page
    $("#artworks ul li a").click(function(){
        $("#content").hide();
        $("#content").load("project.html", function(){
            $(this).fadeIn("slow");
        });
    });

    // load single project page         
    $("#project_page").live("click", function(){
        $("#content").hide();
        $("#content").load("project.html", function(){
            $(this).fadeIn("slow");
        });
    });

        // load single project page         
        $("#project_slider").live("click", function(){
            $("#content").hide();
            $("#content").load("project_inside.html", function(){
                $(this).fadeIn("slow");
            });
        });

        // back to projects page        
        $(".back").live("click", function(){
            $("#content").hide();
            $("#content").load("project.html", function(){
                $(this).fadeIn("slow");
            });
        }); 

// load prensa page
$("#prensa_nav").click(function(){
    $("#content").hide();
    $("#content").load("prensa.html", function(){
      $(this).fadeIn("slow");
    });
});

// load contacto page
$("#contacto_nav").click(function(){
    $("#content").hide();
    $("#content").load("contacto.html", function(){
      $(this).fadeIn("slow");
    });
}); 

// SIDEBAR MENU

// Add class of drop if item has sub-menu
$('ul.submenu').hide().parent('li').addClass('drop');

// open submenu
$('.drop').click(function(){
   $('.submenu',this).slideToggle();
});

//hide submenu when you click other main items            
 $('#menu>li').click(function(){
     if(!$(this).hasClass('active')){
         $('.active .submenu').slideUp();
     }
});

//hide submenu when you click other main items -diego           
 $('#menu li#prensa_nav').click(function(){
     if(!$(this).hasClass('active')){
         $('.submenu').slideUp();
     }
});

//hide submenu when you click other main items -diego           
 $('#menu li#contacto_nav').click(function(){
     if(!$(this).hasClass('active')){
         $('.submenu').slideUp();
     }
});

// active menu item    
$('#menu li').click(function(event) {
    $('#menu li').removeClass('active');
    $(this).addClass('active');      
    event.stopPropagation();
});

// active menu item -diego  
$('#menu li ul li').click(function(event) {
    $('#menu li#artworks ').addClass('active');     
    event.stopPropagation();
});  

});

$(window).load(function() {

// Slider  
$("#slideshow").css("overflow", "hidden");

$("ul#slides").cycle({
    fx: 'fade',
    pause: 1,
    prev: '#prev',
    next: '#next'
    });

$("#slideshow").hover(function() {
    $("ul#nav").fadeIn();
},

function() {
    $("ul#nav").fadeOut();
});

});

這是插件： http ： //malsup.github.com/jquery.cycle.all.js

如何修復此錯誤以加載插件？

我正在按照本教程的方式進行操作......我也用干凈的HTML做了它，它工作了!! 問題是當我將它與ajax加載的內容集成時： http ： //line25.com/tutorials/build-a-simple-image-slideshow-with-jquery-cycle

Answer 1

你為什么不做$("#slides") ？ 您的頁面上只應有一個ID為“幻燈片”的元素。 如果需要選擇多個對象，請考慮使用css類，然后選擇$('.class-name') 。

Answer 2

我認為問題是你在通過AJAX將數據加載到列表之前嘗試在空列表上初始化循環。 相反，您應該在將數據作為列表項注入DOM后初始化循環：

$('#content').load('home.html', function(){
    $("ul#slides").cycle({
        fx: 'fade',
        pause: 1,
        prev: '#prev',
        next: '#next'
    });
});