您需要做的主要事情如下
1. 您的 jquery-ui 版本所需的 jquery 版本的 javascript 文件。
对于 jquery-ui-1.10.3,这可以在下载的根目录中找到。jquery-1.9.1.js。
2. 您打算包含的 jquery 库的 javascript 文件。
还应该有一个“ui”文件夹,里面有一堆 javascript 文件。如果打开,它们中的大多数都有一个约束列表,需要其他 js 文件才能运行它们。这是在您决定不需要所有 jquery ui 功能的情况下。但是,他们确实有一个包含所有其他文件功能的 javascript 文件。对我来说,这个文件被命名为 jquery-ui.custom.js。
如果您希望它在浏览器上运行得更快并且不需要阅读它,那么这个目录还应该包含一个“min”或“minified”文件夹。“缩小”文件夹包含所有相同的 js 文件,但采用缩小形式。缩小的形式被缩短为浏览器可以破译的最小可能的部分,它节省了浏览器加载时间。
3. 您需要一个 css 参考,以用于您选择使用的 jqueryui 库。
Jquery 允许您下载带有一些预先创建的主题的 jquery ui。如果你这样做,你的 css 最好位于 css/[themename] 文件夹中。
在下载 jquery-ui1.10.3 时,这对我来说位于 css/smoothness/jquery-ui.1.10.3.custom.css
与 javascript 一样,您也可以选择缩小版本。在 css 目录中也是一个图像目录。安装时请确保 css 中的图像引用指向此图像文件夹。如果你把它们放在同一个目录中,你应该没问题。
最后,您的 html 页面的头部需要如下内容:
<script type="text/javascript" src="/js/jquery/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="/js/jquery/jquery-ui-1.7.min.js"></script>
<link rel="stylesheet" type="text/css" href="/css/smoothness/jquery-ui-1.7.css" media="all" />
如果仔细观察:
1. 第一个是我的 jquery 代码参考。
2. 第二个是我的 jquery-ui 代码参考。此处的文件包括所有 jquery 功能。
3. 第三个是对我决定使用的主题的 css 引用。
请注意,没有必要使用 jquery-ui 提供的 css 主题,因为您可以编写自己的主题。在这种情况下,您将提供对您自己的 css 文件的引用。在大多数地方,我还没有看到这样做。
最后请注意,当下载带有主题的 jquery ui 时,它们会让您选择 css 范围。如果将其留空,则 css 将应用于所有匹配的元素。如果您决定给它一个 css 范围,那么它将仅适用于该特定范围内的元素。
我的工作是在我的办公室更新 jquery,所以如果有人注意到与此不同的任何内容,请告诉我。