Bootstrap tour需要清除缓存再次工作

Question

我正在尝试在我的Web应用程序中使用bootstrap tour.前5分钟一切正常,我看到了弹出的步骤,第一次也是唯一的一次.然后弹出窗口就消失了.我尝试了很多方法甚至重新启动了电脑,事实证明,每次我清除浏览器缓存,它都可以工作一次.然后我需要再次清除缓存.

代码如下所示:

    helpButton.click(function() {
    if (window.steps === undefined)
        return;
    alert("element: " + window.steps[0].element + ", title: " + window.steps[0].title + ", content: " + window.steps[0].content + ", val: " + $(window.steps[0].element).val());
    var tour = new Tour({
        steps: window.steps
    });
    tour.init();
    tour.start();
    alert("finished.");
});

步骤看起来像:

<script type="text/javascript">
var steps = [
    { element: "#choose-team", title: "????", content: "????????????????", position: "n" },
    { element: ".hidden-editor:first", title: "????2", content: "????????????????2", position: "n" }
];

1. 所有alert()都很好,步骤中的数据都可以(这就是为什么它至少可以运行一次).
2. 所有官方的例子都在他们的网站上很好.
3. IE和Chrome在我的电脑上都有同样的问题.
4. Tour js和css完好无损(从Bootstraptour.com下载).

任何的想法？谢谢.

Answer 1

该问题与库配置有关,因为它默认将数据存储到DOM存储接口.

DOCS

选项: storage

默认: window.localStorage

描述:

您要使用的存储系统.可以是对象window.localStorage,window.sessionStorage或您自己的对象.您可以将此选项设置为false以禁用存储持久性(每次加载页面时,游览从头开始).

固定

var tour = new Tour({
    steps: window.steps,
    storage: false
});

Answer 2

如果存储是必须的,我只是找到另一种解决问题的方法.使用restart()而不是start()也可以解决问题.并且有一个start(true)而不是restart(),但它会直接跳到最后一步.

听起来这个游览是默认的,旨在作为一次性游览.例如,当您的网站上的某些内容更新时,导览应自动运行一次以显示更新,并且永远不会再次打扰用户.

要使其成为可重复的游览,请通过选项中的"storage:false"禁用存储,或使用restart()而不是start().