Jquery pushstate回调脚本



我使用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时如何初始化脚本?

对不起,我是法国人。

您可以使用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/安装和设置#公共方法

控制台有什么错误吗?

编辑2

我怀疑这与sync/async有关。问题是,当你使用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之前触发

最新更新