通过AJAX加载图像滑块

Question

我试图通过AJAX加载图像滑块。当输入包含滑块的页面的直接url时，它可以正常工作。但是当试图通过AJAX加载时，它不会加载。

$('.ajaxed').live('click', function(event) { // loading page via AJAX 
    event.preventDefault(); 
    var link = $(this).attr('href')+' #content'; // jQuery address variables 
    var rewritepath = link.replace($url,'').replace(' #content',''); // jQuery address variables 
    $('#board').load(link,'', function(){ 
     $('html,body').delay(500).animate({scrollTop: 0}, 300, function() { 
      $('#board').slideDown('slow'); 
     }); 
    }); 
    $.address.state($path).crawlable(true).value(rewritepath); // jQuery address 
    return false; 
}); 
$slider.royalSlider({ 
    captionShowEffects:["fade"], 
    controlNavThumbs:true, 
    controlNavThumbsNavigation:true,   
    imageAlignCenter:true, 
    imageScaleMode: "fill", 
    welcomeScreenEnabled:false, 
    hideArrowOnLastSlide:true, 
    autoScaleSlider: true, 
    autoScaleSliderWidth: 980, 
    autoScaleSliderHeight: 650 
}); 

如果我把滑块代码到只使用AJAX，但不是当直接加载页面的运作.ajaxed部分。

Answer 1

您可以将滑块init代码放入函数中，然后可以从任何地方调用它。例如：

$('.ajaxed').live('click', function(event) { // loading page via AJAX 
    event.preventDefault(); 
    var link = $(this).attr('href')+' #content'; // jQuery address variables 
    var rewritepath = link.replace($url,'').replace(' #content',''); // jQuery address variables 
    $('#board').load(link,'', function(){ 
     $('html,body').delay(500).animate({scrollTop: 0}, 300, function() { 
      $('#board').slideDown('slow'); 
     }); 
     init_slider(); 
    }); 
    $.address.state($path).crawlable(true).value(rewritepath); // jQuery address 
    return false; 
}); 

init_slider(); 

function init_slider() { 
    $slider.royalSlider({ 
     captionShowEffects:["fade"], 
     controlNavThumbs:true, 
     controlNavThumbsNavigation:true,   
     imageAlignCenter:true, 
     imageScaleMode: "fill", 
     welcomeScreenEnabled:false, 
     hideArrowOnLastSlide:true, 
     autoScaleSlider: true, 
     autoScaleSliderWidth: 980, 
     autoScaleSliderHeight: 650 
    }); 
}