结束巡视一次后,使用按钮启动Bootstrap巡视

时间:2016-10-26 12:30:42

标签: javascript jquery twitter-bootstrap bootstrap-tour

我有一个简单的网页,其中包含内容和引导程序,以指导我的网页。

我想使用带有以下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();

});

当我点击按钮启动游览时,我可以开始游览。当我点击结束游览按钮时,游览将关闭。但是,当我再次单击启动游览按钮时,游览将无法启动。

我已经审核了以下帖子,但没有任何效果:post1post2

请帮助我解决这个问题,因为我是使用javascript和bootstrap之旅的新手

2 个答案:

答案 0 :(得分:1)

您可以使用restart()功能重启导览。

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

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

答案 1 :(得分:1)

现在巡演按预期工作。我已在启动浏览设置中启用debug为true,以查看浏览器控制台中的日志。我收到错误,上面写着“游览结束,初始化被阻止”。

在代码中进行了以下更改:

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

从以下链接获得解决方案:problem solution