我怎样才能激活第二次兜风之旅

时间:2014-06-18 09:51:55

标签: javascript jquery zurb-joyride

我的兜风之旅有问题,当我完成一次巡回演出时,我想开始第二次巡演。我尝试做的是在postRideCallback中执行一次seconde巡演,但我最终循环了第一次巡演。有人知道如何解决这个问题吗?

function preview(){
    $('#joyRideTipContent').joyride({
        autoStart : true,
        preStepCallback : function(index, tip) {
            console.log(index);
        },
        postStepCallback : function(index, tip) {
        },
        postRideCallback : function(index, tip) {
            console.log("stop1");
            preview2();
            console.log("stop1.1");
        },
        tipLocation:"left",
        modal : true,
        expose : true
    });
}
function preview2(){
    console.log("stop2.0");
    $('#joyRideTipContent2').joyride({
        preStepCallback : function(index, tip) {
        console.log("stop21.0");
        },
        postStepCallback : function(index, tip) {
        console.log("stop22.0");
        },
        postRideCallback : function(index, tip) {
            console.log("stop23");
            alert("tada")
        },
        tipLocation:"left",
        modal : true,
        expose : true
    });
    console.log("stop2.1");
}

在我的代码中(见上文)预览是我用来启动兜风之旅的功能,而console.log只是用于测试而不具有特定含义

3 个答案:

答案 0 :(得分:2)

我知道这是一个老问题,但我添加了一个检查,调用joyride的destroy方法删除之前的教程内容,然后再启动另一个。

function tutorial1(){
    if($('.joyride-tip-content')) {
        $.fn.joyride('destroy')
    }
    $('#joyRideTutorial1').joyride({
        modal:true,
        autoStart : true,
        expose: true
    });
 }
 function tutorial2(){
    if($('.joyride-tip-content')) {
        $.fn.joyride('destroy')
    }
    $('#joyRideTutorial2').joyride({
        modal:true,
        autoStart : true,
        expose: true
    });
 }

到目前为止似乎运作良好。

答案 1 :(得分:0)

你在哪里开始兜风? 你能发布所有的源代码吗? 如果您不这样做,请尝试:

  function preview(){
    $('#joyRideTipContent').joyride({
        autoStart : true,
        preStepCallback : function(index, tip) {
            console.log(index);
        },
        postStepCallback : function(index, tip) {
        },
        postRideCallback : function(index, tip) {
            console.log("stop1");
            preview2();
            console.log("stop1.1");
        },
        tipLocation:"left",
        modal : true,
        expose : true
    }).foundation('joyride', 'start');
  }

答案 2 :(得分:0)

为什么不直接在页面网址中添加查询变量? e.g。

yoursite.com/page?tour=1
yoursite.com/page?tour=2

当您完成巡视1时,您可以在上一个巡视弹出窗口中链接到...?tour = 2。

您需要做的是检查服务器上的查询变量(假设这是生成html的地方)并执行简单的if / else以在html页面中输出相关代码,例如。

if ($tour == 1) {
   // add tour 1 markup and script here
}
elseif ($tour == 2){
  // add your 2 markup and script here
}

这意味着html输出只会有一个游览信息。你现在这样做的方式有点乱,因为旅行团互相冲突。使用这个简单的方法将确保只有一个游览被加载到您的html