通过AJAX动态加载Flexslider

时间:2014-12-11 14:39:27

标签: jquery ajax dynamic load flexslider

我有一个页面index.html,其中包含一个菜单,可以通过AJAX将页面1.html,2.html,3.html等内容动态加载到index.html中的DIV中。

1.html中的内容有一个内置的Flexslider,在通过AJAX加载后不会被初始化。如果我直接调用/刷新页面,滑块会完美加载!

我通过

调用index.html中的滑块
<script type="text/javascript" charset="utf-8">
  $(window).load(function() {
  $('.flexslider').flexslider({
     animation: "slide",
    manualControls: ".flex-control-nav li"
    });
 });
</script>    

我的AJAX调用是在外部.js中,看起来像这样

$(document).ready(function() {

var hash = window.location.hash.substr(1);
var href = $('#nav2mobile li a').each(function(){
    var href = $(this).attr('href');
    if(hash==href.substr(0,href.length-5)){
        var toLoad = hash+'.html #content2';
        $('#content2').load(toLoad)
    }                                           
});

$('#nav2mobile li a').click(function(){

    var toLoad = $(this).attr('href')+' #content2';
    $('#content2').hide('normal',loadContent);
    $('#load').remove();
    $('#load').fadeIn('slow');
    window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
    function loadContent() {
        $('#content2').load(toLoad,'',showNewContent())
    }
    function showNewContent() {
        $('#content2').show('normal',hideLoader());
    }
    function hideLoader() {
        $('#load').fadeOut('normal');
    }
    return false;

});

});

我无法弄清楚如何在将滑块加载到index.html

后启动它

我尝试将Slider调用放入.click(funktion(),但这也不起作用..

有人有想法吗?

谢谢,任何帮助表示赞赏!

1 个答案:

答案 0 :(得分:0)

您是否尝试更改$(window).load(function()的{​​{1}}?

window.onload vs $(document).ready()