jquery - Bootstrap Tour，如何强制停止自动启动？

Question

我真的可以使用帮助来关闭我正在构建的网页的 Bootstrap Tour 插件的“自动启动”功能。这次旅行本身效果很好。它按照预期从一步跳到另一步。但是，当用户第一次查看页面时，导览会自行开始。用户可以按“结束游览”，游览将不再自动开始。但是，我想完全阻止自动启动。

我需要您的帮助来找到一种方法(或设置)来防止游览自行启动。我不希望用户必须按“结束游览”...他们应该只在想要开始游览时按“开始游览”!

请参阅下面的代码。请注意，我省略了页面的大部分代码，因为我不想让您不知所措。

请帮忙，如何停止自动启动游览？

<!-- Bootrap CSS  -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- Tour CSS  -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tour/0.11.0/css/bootstrap-tour.css">


<a id="MSL-initialize-tour">
    START TOUR <span class="glyphicon glyphicon-play"></span>
</a>

<!-------- JQuery JS -------->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-------- Bootsrap JS -------->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!-------- Bootsrap Tour JS -------->
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tour/0.11.0/js/bootstrap-tour.js"></script>

<!-------- Bootsrap Tour Steps -------->
<script>
// Instance the tour
var tour = new Tour({
  steps: [ 
  {
    element: "#MSL-initialize-tour",
    placement: "bottom",
    title: "<span class='glyphicon glyphicon-star'></span> Welcome to MSL!",
    content: "Press 'next' to see page features."
  }
]});

tour.init();
tour.start();

$('#MSL-initialize-tour').click(function(){
 tour.restart();
});
</script>

Answer 1

你需要移动

tour.init();
tour.start();

在函数内部。现在，一旦加载 Javascript，它们就会被调用。

Here is a JSFiddle example

您可以看到init、start和restart如何都在同一个函数中，当用户单击“Start”时调用该函数游览”按钮。