javascript - 跳房子按钮点击不起作用

标签 javascript jquery html css

关于以下 Hopscotch 为何不起作用的任何想法?我们希望用户能够点击一个按钮开始游览。 非常感谢!

<html>
  <head>
    <title>My First Hopscotch Tour</title>
    <link rel="stylesheet" href="css/hopscotch.css">
  </head>
  <body>

    <h1 id="header">My First Hopscotch Tour</h1>
    <div id="content">
      <p>Content goes here...</p>
    </div>
    <button id="myBtn">Click Me</button>

    <script>
      var tour = {
        id: "hello-hopscotch",
        steps: [
          {
            title: "My Header",
            content: "This is the header of my page.",
            target: "header",
            placement: "bottom"
          },
        ]
      };
      $("#myBtn").click(function(){
        hopscotch.startTour(tour);
      });
    </script>

    <script src="js/hopscotch.js"></script>

  </body>
</html>

最佳答案

添加 Jquery 脚本:

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="js/hopscotch.js"></script>

在此处查看演示: http://codepen.io/ihemant360/pen/OXmqXR

关于javascript - 跳房子按钮点击不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38157850/

相关文章:

javascript - 使用 Javascript 添加 onClick 函数没有通过

javascript - axios在拦截器中重复url

javascript - Django 。通过js渲染模型参数

javascript - 切换页面时保留表单数据

javascript - 文本不会包裹在我的 flexbox 容器中

javascript - 严格模式 -> 更改了 Controller 结构,在 For In 循环中获取 'key is not defined'

javascript - 尝试使用 jQuery 清除表单输入,以便我可以将其添加回表单

javascript - Activity 菜单选项卡下的滑动箭头

php - jquery、iframe 和表单 天哪!

html - 如何让我的汉堡包菜单直接出现在我的汉堡包图标下方?