Hopscotch on关闭游览功能

【问题标题】：Hopscotch onClose tour functionHopscotch on关闭游览功能
【发布时间】：2016-04-18 23:14:46
【问题描述】：

我正在使用 Hopscotch 创建一个游览，我想为用户创建一个能够在他们点击页面后进行或退出浏览的功能。

我正在尝试创建一个 onClose 函数，但我卡住了。

var tour = {
   id: "businesstour-hopscotch",
   steps: [
{
  title: "Welcome",
  content: "This is the new business profile page, click next to have a quick tour.",
  target: document.querySelector('#companyname'),
  placement: "right",
  xOffset: -380,
  yOffset: 52,
  onClose: function() {
    window.location = '/';
  }
},

等等等等，但它不工作。也没有显示结束游览的按钮。任何想法都会有所帮助！

【问题讨论】：

标签： javascript hopscotch

【解决方案1】：

根据我对文档的理解，onClose 定义是一个“Tour Option”，应该这样声明，而不是在步骤中声明：

var tour = {
   id: "businesstour-hopscotch",
   onClose: function() {
       window.location = '/';
   },
   steps: [{
       title: "Welcome",
       content: "This is the new business profile page, click next to have a quick tour.",
       target: document.querySelector('#companyname'),
       placement: "right",
       xOffset: -380,
       yOffset: 52
     }]
};

我正在像这样初始化我的，这适用于用户点击游览右上角的“x”。但是，当用户在导览的最后一步单击“完成”按钮时，我没有看到此事件被触发。

【讨论】：

为此，您还应该添加： onEnd: function() { hopscotch.endTour(true); window.location = '/'; }，就在 onClose 定义之后。