jquery - 未捕获的 TypeError : $(. ..).draggable 不是函数

Question

这个问题已经有答案了:

jQuery UI - Draggable is not a function? (18 个回答)

已关闭 6 年前。

大家好，我正在尝试使一些 div 可拖动，并且我已经设法使用 jquery-ui 做到了这一点。我还有一个脚本，可以删除 2 个 div 并将它们组合成一个(就像它们已合并在一起一样)，但是当我在新的“合并”div 上调用可拖动函数时，我得到的错误是标题...所以问题是什么 ？ .draggable 函数怎么可能在一个地方工作而不在另一个地方(在同一个文件上)!!

这是可拖动的功能:

function drag($class){
$("."+$class).draggable({
containment: ".tab-content",
grid: [ 3, 3 ],
zIndex:100,
obstacle: "#nothere",
preventCollision: true,
drag:
function(){
    $(".test").css("background-color","red");
    $(this).css("background-color","green");
    }

});
} 

首先我将其称为测试类，它完美运行，没有错误

drag("test");

但是当我在合并函数中再次调用它时，它返回错误:未捕获的类型错误:$(...).draggable 不是函数

drag("test:not(.ui-draggable)");

js文件已正确加载:

<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script>

Answer 1

请务必在您的项目中包含以下文件:

  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

检查他们的example 。使用开发者工具(Chrome 下的 F12)查看是否所有资源都已导入。