禁用/隐藏引导游中的“结束浏览”按钮

Question

使用bootstrap-tour插件(http://bootstraptour.com/)，除最后一步外，我希望禁用或隐藏每个步骤上的默认“结束巡回赛”按钮。

我试着修改step模板以完全摆脱End Tour按钮，但是如何在最后一步激活它呢？

Answer 1

1. 使用模板参数将类.btn-end添加到end按钮： var旅游=新旅游({模板：“PrevNext”结束旅游“})；
2. 使用CSS：.btn-end将默认情况下的.btn-end设置为隐藏
3. 以最后一步为目标，使用CSS中的#step-x ID。最后一个步骤ID是步骤数减去1(计数从0开始)。如果您有5个步骤，Id将是#step-4 (5-1= 4)。 #step-4 .btn-end { display: block; }

参见这里的一个工作示例：http://jsfiddle.net/Zfu5f/2/

Answer 2

Axel答案的另一种选择是使用数据部分作为CSS选择器：

1. 默认情况下，将End按钮设置为隐藏：.popover-navigation [data-role="end"] { display: none; }
2. 使用：#step-4 .popover-navigation [data-role="end"] { display: block; }瞄准最后一步

这缩短了步骤的数量，如果您在其他地方定义了自定义弹出器，这将防止您不得不重新复制该模板。