javascript - Disable 'Next' button temporarily in Bootstrap Tour -


i'm using bootstrap tour build rather restrictive tour in user can proceed next step after spending 3 seconds on current step.

in order to this, gave 'next' button id nextbtn in tour template, , hope can enable/disable this:

var tour = new tour ({     name: "my-tour",     template: "...",     onnext: function(tour) {         $("#nextbtn").prop("disabled", true);     }),     onshow: function(tour) {         window.settimeout(next, 3000);     });  function next() {     $("#nextbtn").prop("disabled", false); } 

however, not working. should right approach here?

there typos, main problem have use correct selector access "next" button, not #nextbtn, it's nesting of classes $(".popover.tour-tour .popover-navigation .btn-group .btn[data-role=next]").

in onshow , onnext event popover not accessibile because boostrap destroy , recreate it, correct event onshown:

function execute right after each step shown.

code:

var timer; var tour = new tour({     onshown: function (tour) {         $(".popover.tour-tour .popover-navigation .btn-group .btn[data-role=next]").prop("disabled", true);         timer=window.settimeout(next, 3000);     } })  function next() {         $(".popover.tour-tour .popover-navigation .btn-group .btn[data-role=next]").prop("disabled", false);     window.cleartimeout(timer); }  tour.addstep({     element: "#one",     title: "step 1",     content: "content step 1" })  tour.addstep({     element: "#two",     title: "step 2",     content: "content step 2" })  tour.addstep({     element: "#three",     title: "step 3",     content: "content step 3" })  tour.start() 

demo: http://jsfiddle.net/irvindominin/3yy7y/


Comments

Popular posts from this blog

c# - How Configure Devart dotConnect for SQLite Code First? -

java - Copying object fields -

c++ - Clear the memory after returning a vector in a function -