Question

好的，有人可以向我解释一下，就像我5岁那样吗？

我下载了这个jQuery插件（aSimpleTour）的zip文件，它基本上是一个弹出游览/向导，通过你加载它的任何网站。唯一的问题是...... 我不知道如何设置它！

我很确定你需要至少将这些引用到HTML头部的引用中吗？

 <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
 <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>

据我所知，这引用了整个jQuery库或其他东西。

popup tour的教程有一些像我这样的代码，我猜你的HTML页面的<body>。

<script>
options = {
    data : [
      { element: '#id', 'tooltip' : 'This is a tooltip for some element #id' },
      { element: 'ul li:last a', 'tooltip' : 'The last link of some ul list' },
      { element: '.class', 'tooltip' : 'A tooltip for some class' }
    ],
    controlsPosition : 'RT'
  }

  $.aSimpleTour(options);
  </script>

到目前为止，我看到他们使用JSON语法的目的是什么，不太确定if function ...

我有zip文件夹中的文件3个文件：

component.json
jquery.aSimpleTour.js
jquery.aSimpleTour.min.js

好的，考虑到所有这些，我从哪里开始？我是一个完整的jQuery n00b，在实现另一个源代码/ app /你有什么时，阅读文档没有多大帮助。

任何人可以帮助我，或者只是简单解释一下如何使用jQuery插件吗？

干杯！

Answer 1

您拥有的3个文件的方式与包含jquery文件的方式相同（在头部），但是您需要指定文件的路径，以获取更多详细信息http://andreaslagerkvist.com/how-to-include-a-jquery-plug-in/。这里的一个问题是你在DOM准备好之前尝试初始化插件你应该这样做：

$(function () {
options = {
    data : [
      { element: '#id', 'tooltip' : 'This is a tooltip for some element #id' },
      { element: 'ul li:last a', 'tooltip' : 'The last link of some ul list' },
      { element: '.class', 'tooltip' : 'A tooltip for some class' }
    ],
    controlsPosition : 'RT'
  }

  $.aSimpleTour(options);
});

编辑：您还应该阅读this，因为该插件依赖于this插件，这意味着您也必须包含该插件。

Answer 2

jquery是一个javascript库。您可以直接将它包含在您的网站中，也可以将其引用到其他地方（如CDN或其他东西），一旦在HTML文件中引用，您就可以在javascript中的任何位置使用jquery语法。

在这种情况下，您希望使用jquery插件，这意味着您需要从用户浏览器访问库和jquery插件。这取决于插件的编写方式。

在这种情况下，您已经获得了三个文件，我建议将.json文件放入您的网站，然后将.min.文件放入您的网站，然后您可以引用jquery和那些你的HTML中的文件。

谁能给我一个简单的解释如何实现这个jQuery插件？

2 个答案: