jQuery 工具范围输入从本地 javascript 加载答案

【问题标题】：jQuery Tools Range Input load from local javascriptjQuery 工具范围输入从本地 javascript 加载
【发布时间】：2013-06-20 07:29:24
【问题描述】：

我在 HTML5 中搜索了很长时间的滑块。在我搜索时，我偶然发现了看起来非常漂亮的 jQuery Tools。所以我试一试。我下载了所需的 CSS 文件并启动以下代码，工作正常。

<!DOCTYPE html>
<html>
<head>
  <script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
    <!-- rangeinput styling -->
  <link rel="stylesheet" type="text/css" href="skin1.css"/>
</head>

<body>
  <input type="range" name="test" min="100" max="300" value="150" />
  <script>
    $(":range").rangeinput();
  </script>
</body>
</html>

到目前为止一切正常。现在我想从网站下载最小版本的工具，只包括范围输入（大小：大约 4 kb，太棒了！）。我使用本地保存的 JavaScript 文件，不起作用。所以我创建了最大可用文件，不会工作。所以我下载了src链接中提到的文件，工作正常。我不明白为什么……有人知道我做错了什么吗？

【问题讨论】：

标签： javascript range jquery-tools

【解决方案1】：

jQuery.rangeinput 是 jQuery 工具库之一。

full/jquery.tools.min.js 包含以下 UI 库 + jQuery 库 (138.7 kB)

dateinput/dateinput.js
overlay/overlay.js
overlay/overlay.apple.js
rangeinput/rangeinput.js
scrollable/scrollable.js
scrollable/scrollable.autoscroll.js
scrollable/scrollable.navigator.js
tabs/tabs.js
tabs/tabs.slideshow.js
工具箱/toolbox.expose.js
工具箱/toolbox.flashembed.js
工具箱/toolbox.history.js
工具箱/toolbox.mousewheel.js
工具提示/tooltip.js
tooltip/tooltip.dynamic.js
工具提示/tooltip.slide.js
validator/validator.js

更好地加载由 dateinput、rangeinput 和验证器工具组成的 form/jquery.tools.min.js。 (19.3 kB) + jQuery 库。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script src="http://cdn.jquerytools.org/1.2.7/form/jquery.tools.min.js"></script>

有关 jQuery 工具的更多信息，请访问http://jquerytools.org/download/

如果您想单独使用范围输入，最好尝试任何其他单独提供范围输入功能的插件。您可以使用以下两个插件中的任何一个并节省超过 10KB。

slideControl.js - http://nikorablin.com/slideControl/
jQuery 简单滑块 - http://loopj.com/jquery-simple-slider/

【讨论】：

【解决方案2】：

如果您使用的是独立版本的 rangeinput（大约 4kb），您应该在页面的某处包含一个 jquery 主库。

【讨论】：

【解决方案3】：

因为所有 JQueryTools 插件使用并且需要 JQuery 库。

这意味着你有两个选择：

在使用CDN link for example之前下载一个自定义版本的JQueryTools并包含JQuery lib
下载自定义版本的 JQueryTools，包括这样的 JQuery 库：

【讨论】：