javascript - jQuery UI draggabe 未定义

标签 javascript jquery jquery-ui meteor

我正在尝试使用 jquery UI 功能创建一个 meteor 应用程序。 但是我无法让它工作。 meteor 应用程序框架工作正常,但是一旦我开始使用 jQuery UI,我就会收到如下错误:

$("#draggable1").draggable is not a function

在 Firebug 控制台中。

我尝试以多种方式包含 jquery 和 jquery UI 包:

  1. 添加了 jquery 包
  2. 在我的 meteor 应用程序文件夹中的文件夹\client\js\libs 中本地引用了 jquery 和 jquery UI
  3. 只有 client\js\libs 中的文件,没有在我的 html 文件中引用它们。
  4. 在我的 html 文件中引用了 jQuery 和 jQuery UI 的 CDN 版本

根据 firebug,在每种情况下,javascript 文件似乎都可以正常加载。但是像下面这样的代码根本不起作用(在我的 3views.js 文件中——3views 是我的 meteor 应用程序的名称):

if (Meteor.is_client) {

    $( "#draggable1" ).draggable({ revert: "invalid", snap: ".ui-widget-header", snapMode: "inner", snapTolerance: 100 });

...

在我的 3views.html 中:

...
<div id="draggable1" class="ui-widgetc-content draggable_box">
<img id="imgpair1" src="objects/obj_pair1a.png" class="objectpair">
</div>
...

使用 jQuery UI 小部件的正确方法是什么?

最佳答案

可能您的库版本没有可拖动的小部件。转到 download builder并将其包括在内。

此外,检查您是否首先包含了 jquery,然后是 jqueryui 的脚本。

喜欢..

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/ui/1.8.23/jquery-ui.min.js" type="text/javascript"></script>

关于javascript - jQuery UI draggabe 未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12130128/

相关文章:

javascript - 格式化表号?

javascript - 将鼠标悬停在绝对 div 上时滚动整个页面

jquery - 如何将 jQuery UI DatePicker 图标触发器与 Bootstrap 3 的输入组结合起来

jquery - 模式对话框内的 .NET MVC 和 jQuery-UI 表单

javascript - Highcharts JS 未捕获类型错误 : x[(intermediate value)(intermediate value)(intermediate value)] is not a constructor

javascript - 闭包真正指的是什么?

javascript - 在 node.js 和 express 中下载 XLS

javascript - 如何构建 Node CLI 应用程序

javascript - 光标自动移动的 CSS 属性

javascript - 简单的 html 编辑器并使用 div 或 textarea 获取 html 内容