前言
据我了解，您有以下内容：
- 多个包含单个导览的页面（每个页面的导览不同）
- 一种检测首次登录帐户的方法（ruby 登录计数）
- 根据首次登录能够添加脚本值
解决方案概述
以下解决方案使用 localStorage 存储每个导览的标识符及其是否已被查看的键值对。由于 localStorage 是唯一的，它在页面刷新和会话之间都能保持存储状态。正如名称所示，localStorage 对每个域、设备和浏览器都是唯一的（例如，即使是相同的域，Chrome 的 localStorage 也无法访问 Firefox 的 localStorage，您笔记本电脑上的 Chrome localStorage 也无法访问您手机上 Chrome 的 localStorage）。我提到这一点是为了说明对 Preface 3 的依赖性，以切换 JS 标志表示用户之前是否已登录。
为了启动导览，代码将检查 localStorage 是否将其对应的键值对设置为 true（表示已经“查看”了）。如果存在且设置为 true，则不会启动导览，否则将运行。当每个导览开始时，使用其 onStart 方法，更新/添加导览的标识符到 localStorage 并将其值设置为 true。
可以通过手动调用导览的 start 方法来执行导览，如果您只想执行当前页面的导览；否则，可以清除所有与导览相关的 localStorage 并将用户发送回第一个页面/如果您在第一个页面上，再次调用 start 方法。
JSFiddle（基于其他问题的 HTML 问答）
HTML（这可以是具有 id="tourAgain" 属性的任何元素，以使以下代码工作。
<button class="btn btn-sm btn-default" id="tourAgain">Take Tour Again</button>
JS
var isFirstLogin = true;
var userID = 12345;
$(function() {
var $els = {};
var tour;
var tourLocalStorage = JSON.parse(localStorage.getItem('myTour')) || {};
function activate(){
populateEls();
setupTour();
$els.tourAgain.on('click', tourAgain);
if(isFirstLogin){
if(typeof tourLocalStorage.userID !== "undefined" && tourLocalStorage.userID !== userID){
localStorage.removeItem('myTour');
tourLocalStorage = {};
}else if(typeof tourLocalStorage.userID === "undefined"){
tourLocalStorage.userID = userID;
localStorage.setItem('myTour', JSON.stringify(tourLocalStorage));
}
checkShouldStartTour();
}
}
function populateEls(){
$els.body = $('body');
$els.document = $(document);
$els.tourAgain = $('#tourAgain');
}
function setupTour(){
tour = new Tour({
name: 'homepage',
storage: false,
backdrop: true,
onStart: function() {
tourHasBeenSeen(this.name);
$els.body.addClass('is-touring');
},
onEnd: function() {
console.log('ending tour');
$els.body.removeClass('is-touring');
},
steps: [{
element: "div.navbar-header img.navbar-brand",
title: "Go Home",
content: "Go home to the main page."
}, {
element: "div.navbar-header input#top-search",
title: "Search",
content: "Here you can search for players by their name, school, positions & bib color (that they wore in our tournament)"
}, {
element: "span.num-players",
title: "Number of Players",
content: "This is the number of players that are in our database for this Tournament"
}, {
element: '#page-wrapper div.contact-box.profile-24',
title: "Player Info",
content: "Here we have a quick snapshot of the player stats"
}]
});
tour.init();
}
function checkShouldStartTour(){
var tourName = tour._options.name;
if(typeof tourLocalStorage[tourName] !== "undefined" && tourLocalStorage[tourName] === true){
console.log('tour detected as having started previously');
return;
}else{
console.log('tour starting');
tour.start();
}
}
function tourHasBeenSeen(key){
tourLocalStorage[key] = true;
localStorage.setItem('myTour', JSON.stringify(tourLocalStorage));
}
function tourAgain(){
localStorage.removeItem('myTour');
tour.start();
}
activate();
});
PS. 我们不使用onEnd来触发tourHasBeenSeen函数的原因是，当前版本的bootstrap tour存在一个bug，即如果最后一步的元素不存在，则导游会在不触发onEnd回调的情况下结束，BUG。
user.sign_in_count > 1检查来管理它。因此，一旦他们登录超过一次，他们就不会再看到它了。我现在正在努力解决的问题只是防止在第一次登录时每次加载页面时都触发导览。 - marcamillion