结束一次游览后,用按钮开始引导游览

Starting Bootstrap tour with a button after ending tour once

本文关键字:按钮 开始 一次 结束      更新时间:2023-09-26

我有一个简单的网页,内容和引导游览我的网页。

我想用一个带有以下html代码的按钮来触发游览:

<button id="initiate_tour" type="button" class="btn btn-danger">Initiate Tour</button>

初始化游览的JS如下:

// Instance the tour
var tour = new Tour({
  backdrop: false, 
  storage: false        
});
tour.addSteps([
    {
        element: "#1",
        title: "title1",
        content: "content1"
    },
    {
        element: "#2",
        title: "title2",
        content: "content2"
    },
    {
        element: "#3",
        title: "title3",
        content: "content3"
    },
    {
        element: "#4",
        title: "title4",
        content: "content4"
    }
  ]);
$("#initiate_tour").click(function(){
    // Start the tour
    tour.start();
});

当我点击按钮Initiate tour 时,我可以开始游览。当我点击结束游览按钮游览关闭。但是当我再次点击Initiate Tour按钮时,Tour没有开始。

我已经参考了以下帖子,但没有任何工作:post1和post2。

请帮助我解决这个问题,因为我刚开始使用javascript和bootstrap tour

现在该旅行正在按预期工作。我在引导旅行设置中启用了debug为真,以便在浏览器控制台中查看日志。我得到一个错误提示"Tour ended, init prevent"。

在代码中做了如下修改:

$("#initiate_tour").click(function(){
    tour.init();
    tour.restart();
});

从以下链接得到解决方案:问题解决方案

您可以使用restart()函数重新开始游览。

http://jsfiddle.net/tejashsoni111/6hh8z5qc/1/

$("#initiate_tour").click(function(){
    // Start the tour
    if(!tour.start()){
        tour.restart();
    }
});