Skipping steps on a Bootstrap Tour?

I have a situation where I have a tour containing eleven steps.

At each step, the pop-up window contains the buttons "Prev", "Next", "End Tour". Instead of using the “End Tour” to “skip,” I try to skip all the steps and go to step 11, but I can't get it to work.

steps: [
{
    element: "#mobile",
    title: "Mobile Number",
    content: "Click ‘Next’ to view the next search field, Click ‘Previous’ to view the previous search field and click ‘skip’ to select End result.",
    placement: "right",
    backdrop: true,
    orphan: true,
    template: function (step) {
        return "<div class='popover tour'><div class='arrow'></div><h3 class='popover-title'></h3><div class='popover-content'></div><div class='popover-navigation'><button class='btn btn-xs btn-pink' data-role='prev'>« Prev</button><span>&nbsp;</span><button class='btn btn-xs btn-danger' data-role='next'>Next »</button><span>&nbsp;</span><button class='btn btn-xs btn-success' data-role='skip'>Skip</button> </div>   </nav>  </div>"
    },
    onNext: function () {
        dir = 'next';
    },
    onPrev: function () {
    },
    onShown: function () {
    }
}

]

Here I use the data role as "skip". How can I use this as a function similar to the functions onShow (), onEnd (), etc.

I tried using the goTo (i) method.

+4
source share
2 answers

after reading the DOC - there is no method to complete the skip steps.

.

( 3 ):

1.) (, , ):

<button class='btn btn-xs btn-success' data-role='skip'>Skip</button>

2.) , :

$("body").on("click","button",function(){
    if($(this).attr("data-role") === 'skip'){
        alert("skip pressed :)");
        tour.goTo(2);        
    }
});

( ): 2.) : a) b.) () ( x)) c.) x + 1

:

JQuery- -

+2

,

onNext: function(tour){
  var curr=parseInt(tour.getState("current_step"));
  while(true){
    curr+=1;
    var step=tour.getStep(curr);
    //TODO: check if it undefined
    if($(step.element).length){
      tour.goto(curr);
      return curr;
    }
  }
},
onPrevious: function(tour){
  var curr=parseInt(tour.getState("current_step"));
  while(true){
    curr-=1;
    var step=tour.getStep(curr);
    //TODO: check if it undefined
    if($(step.element).length){
      tour.goto(curr);
      return curr;
    }
  }
}
0

All Articles