javascript - intro.js 不适用于基于类的特定元素

Question

我无法使用具有 class='test' 的特定元素启动 intro.js。我正在使用 Intro.js v0.9.0 。

根据文档，我按照以下方式编写了代码。

 <li class="test" data-intro="first Step" data-step="1"><a href="#" data-toggle="tooltip" data-placement="bottom" title="Chart" id="chart-btn"><i class="fa fa-bar-chart-o fa-lg"></i></a></li>
 <li class="test123" data-intro="first Step" data-step="1"><a href="#" data-toggle="tooltip" data-placement="bottom" title="Reset" id="reset"><i class="fa fa-repeat fa-lg"></i></a></li>
 <li class="test" data-intro="second Step" data-step="2"><a href="#" data-toggle="tooltip" data-placement="bottom" title="Compute" id="category"><i class="fa fa-play fa-lg"></i></a></li>

我试过这样开始intro

 introJs(".test").start();

它不工作。我用眼镜看了一些人关于 this 的建议，我也尝试了这些方法，但它不起作用。

我该如何解决这个问题。

Answer 1

我使用 steps 实现，它由 intro.js 插件选项提供，就像在以下方式。

 var intro = introJs();
      intro.setOptions({
        steps: [
          { 
            intro: "Hello world!"
          },
          {
            element: document.getElementById("step1"),
            intro: "This is a tooltip."
          },
          {
            element: document.querySelectorAll('#step2')[0],
            intro: "Ok, wasn't that fun?",
            position: 'right'
          },
          {
            element: '#step3',
            intro: 'More features, more fun.',
            position: 'left'
          },
          {
            element: '#step4',
            intro: "Another step.",
            position: 'bottom'
          },
          {
            element: '#step5',
            intro: 'Get it, use it.'
          }
        ],
        showStepNumbers:false
      });

      intro.start();