我正在尝试让单个“下一步”按钮创建不同的弹出窗口(弹出窗口 1、2、3 等...):每个弹出窗口都应该显示为附加到页面上的不同 div。
我们正在尝试创建一个“Take a Tour”功能,其中不同的功能由不同的弹出窗口解释。
最佳答案
手动显示/隐藏弹出窗口。
单击“下一步”按钮时,按顺序显示和隐藏弹出框:
var currentPopover = -1;
var popovers = [];
// Initialize all the popovers to be "manually" displayed.
popovers.push($("#ctrl1").popover({ trigger: 'manual' }));
popovers.push($("#ctrl2").popover({ trigger: 'manual' }));
popovers.push($("#ctrl3").popover({ trigger: 'manual' }));
// On each button click, hide the currently displayed popover
// and show the next one.
$("#NextBtn").click(function() {
if (currentPopover >= 0) {
popovers[currentPopover].popover('hide');
}
currentPopover = currentPopover + 1;
popovers[currentPopover].popover('show');
});
以上代码未经编译或测试。
关于javascript - 使 bootstrap popover 出现在与其触发器不同的元素上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17152266/