jquery pushstate 回调脚本

Question

我使用 html5 历史推送状态来加载一些博客文章页面。

在通过 pushstate 加载的每个页面中，我都有一个滑块 (iosslider)。 当我加载博客页面时，滑块不起作用。我想我需要回调 iosslider 脚本。

这是用于初始化它的 iosslider 脚本：

$('.iosSlider').iosSlider({
responsiveSlideContainer: true,
responsiveSlides: true,
snapToChildren: true,
desktopClickDrag: true,
keyboardControls: true,
infiniteSlider: true,
navSlideSelector: true,
autoSlide: true,
autoSlideTimer: 5000,
navNextSelector: $('.slider-next'),
navPrevSelector: $('.slider-prev'),
navSlideSelector: $('.slider-pagination .slider-page'),
onSlideChange: slideChange
});

触发pushstate时如何初始化脚本？

对不起我的英语，我是法国人。

Answer 1

您可以使用window.onpopstate 事件来调用脚本。

在那里查看文档：

https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history#The_popstate_event

编辑

你试过了吗：

$(element).iosSlider('update');

http://iosscripts.com/iosslider/#installation-and-setup#public-methods

你在控制台有什么错误吗？

编辑 2

我怀疑它与同步/异步有关。问题是当您使用 pushstate 时，页面并没有真正“重新加载”。我猜滑块的脚本刚刚停止，你需要重新启动它，但它已经实例化了，你不能再初始化它。

尝试：

$(element).iosSlider('destroy');

然后再次初始化。

在您的 onpopstate 函数中将其放在此之后：

 if (event.state) {
        load_content(event.state.title, window.location.pathname, true);
        // here

编辑 3

用途：

$(window).load(function () { 
     // initialize
});

注意onload会在onpopstate之前触发。