jquery Mobile - 导航其他页面后 JavaScript 停止工作

Question

我正在使用 jquery mobile 最新版本。一切正常。我有一些自定义的外部和内部 JS 脚本。主页中有一个 jquery 幻灯片，它运行良好，但是当我导航到另一个页面并返回主页时通过按后退按钮或单击任何链接页面，幻灯片将停止工作。

如果我添加这些链接 data-ajax="false" ，那么幻灯片在任何情况下都能正常工作。但我不想使用 data-ajax="false"" 以便快速响应。我怎么解决这个问题？我对 jquery mobile 有点陌生。

Answer 1

根据docs当您在 jQuery Mobile 中的页面之间导航时，默认情况下会重新加载内容。当您使用 data-ajax="false" 时，强制 jQuery Mobile 完全重新加载页面，因此您的脚本可以正常工作。

您似乎有以下幻灯片调用:

$(function(){
     // init gallery on DOM ready
     $('.gallery').slideshow();
});

但是，当您使用 jQuery Mobile 在页面之间导航时，您需要在某些页面重新加载时重新初始化图库，因此通用代码将如下所示:

$(document).bind('pageinit', function() {
     // init gallery when current page loaded
     $('.gallery').slideshow();
});