我正在使用bootstrap之旅进行页面浏览。我想要做的是在您访问页面后自动启动游览,但在下次访问时,游览不应自动启动,而是在您单击按钮时。我猜这可以通过“存储”完成,但我不知道如何。有人可以帮忙吗?感谢
答案 0 :(得分:1)
' storage '需要是' window.localStorage '。此值是默认值,因此您无需添加任何选项。
// Instance the tour
var tour = new Tour();
tour.addSteps([
{
element: "#one",
title: "First",
content: "First Content",
placement: "right"
}, {
element: "#two",
title: "Second",
content: "Second content",
placement: "right"
}
]);
tour.init();
tour.start();
$("#startTour").click(function () {
tour.restart();
})
div#one {
padding:20px;
margin:50px;
width:100px;
height:100px;
background-color:gray;
}
div#two {
padding:20px;
margin:50px;
width:100px;
height:100px;
background-color:aqua;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/css/bootstrap.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tour/0.10.1/css/bootstrap-tour.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-tour/0.10.1/js/bootstrap-tour.js"></script>
<div id="one">First step</div>
<br>
<div id="two">Second step</div>
<div>
<button id="startTour" class="btn btn-success">Start</button>
</div>
答案 1 :(得分:1)
我们应该遇到同样的问题,请在此处查看我的问题和答案:Bootstrap tour needs to clear cache to work again。
使用restart()代替start()或设置&#34; storage:false&#34;可以解决问题。