如何在ajax加载的内容中启动Nivo Slider？

当包含它的页面已被ajax加载时，我无法启动Nivo滑块。

这是HTML

  
 Nivo Slider Project
 
 
This is some intro text for Nivo Slider Project
 
 
  

这是jQuery

 $(function(){ function close_other() { var selected_work = $('.selected_work'); selected_work.children('.pictures').empty(); $('.selected_work img.arrow').attr("src", "https://stackoverflow.com/questions/8388776/how-to-initiate-nivo-slider-in-ajax-loaded-content/images/arrow_open.gif"); selected_work.removeClass("selected_work"); } $('div.work a').click(function(e) { e.preventDefault(); }); $('div.work').bind('click', function() { $('html,body').animate({ scrollTop: $(this).offset().top }, 500); var href = $(this).find('a').attr('href'), lastPart = href.split('/'), hash = lastPart[lastPart.length - 1]; window.location.hash = hash; var parent = $(this); var content_holder = parent.children(".pictures"); if (parent.hasClass("selected_work")) { close_other(); return; } close_other(); parent.addClass("selected_work"); content_holder.load(href + ' #ajaxContent', function() { $(this).find('#slider').nivoSlider({ effect:'fade', //Specify sets like: 'fold,fade,sliceDown' animSpeed:300, pauseTime:4000, controlNav:true, pauseOnHover:true //Stop animation while hovering }); }); $('.selected_work img.arrow').attr("src", "images/arrow_close.gif"); }); }); 

这是一个现场演示： http ： //www.spiritlevel.co.uk/clicktest/divclicknivotest.html “Nivo滑块项目”是我想要工作的…

可能做了一些基本的错误，因为我是jQuery的新手所以非常感谢你能给予的任何帮助。

非常感谢。

Answer 1

在你的.work中运行一个函数，试试吧。 但请注意，必须为.pictures使用正确的nivo滑块html结构。

 $('div.work').click(function(e) { $('.pictures').show(); $('.pictures').data('nivoslider').stop().start; //Stop the Slider if it's currently running, then start it. e.preventDefault(); }); 

Answer 2

事实certificate，这里的问题不是代码，而是旧版Nivo Slider和当前版本的jQuery（1.7.1）之间的冲突。 当我回到jQuery 1.4.2时它起作用了。 然后我用当前的jQuery将Nivo Slider更新到最新版本，它也有效。