Javascript 在jQuery加载后初始化滑块

Javascript 在jQuery加载后初始化滑块,javascript,jquery,html,swiper,Javascript,Jquery,Html,Swiper,我在项目中使用jQuery滑块(Swiper)。如果我加载页面,初始化滑块可以正常工作,但是当从html文件加载新内容(使用滑块)时,滑块不会初始化。目前的步骤: 创建新节: var section = $('<section class="cd-section overflow-hidden '+newSection+'"></section>').appendTo(mainContent); 如何使滑块在加载事件后进行初始化?我使用以下方法解决了此问题: 索引页的

我在项目中使用jQuery滑块(Swiper)。如果我加载页面,初始化滑块可以正常工作,但是当从html文件加载新内容(使用滑块)时,滑块不会初始化。目前的步骤:

创建新节:

var section = $('<section class="cd-section overflow-hidden '+newSection+'"></section>').appendTo(mainContent);

如何使滑块在加载事件后进行初始化?

我使用以下方法解决了此问题:

  • 索引页的标题中需要有swiper样式
  • 在加载事件之后调用
    slidername.update(true)
    ,以更新 DOM操作后的滑块

有关更新功能的更多参考信息,请参阅。

我使用以下方法解决了此问题:

  • 索引页的标题中需要有swiper样式
  • 在加载事件之后调用
    slidername.update(true)
    ,以更新 DOM操作后的滑块
有关更新功能的详细信息,请参阅

section.load(newSection+'.html .cd-section > *', function(event){

    if(typeof Swiper == "undefined") {
        console.log("Ready to rumble");
        $.getScript('js/swiper.jquery.min.js', function() {
            var swiper = new Swiper('.swiper-container', {
                pagination: '.swiper-pagination',
                paginationType: 'progress',
                nextButton: '.swiper-button-next',
                prevButton: '.swiper-button-prev',
                slidesPerView: 'auto',
                centeredSlides: true,
                spaceBetween: 30,
                grabCursor: true,
            });
        });
    }
});