jQuery的UI – Draggable不是一个函数？
我试图在页面上的一些div上使用可拖动的效果，但每当我加载页面，我得到的错误消息：
Error: $(".draggable").draggable is not a function 我看了一下，似乎其他人有这个问题，因为他们没有包括jQuery UI JavaScript文件，但我肯定有。
以下是我的页面的标题：
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
任何人都可以提出解决scheme
任何意见赞赏。
谢谢。
快速编辑，我也有jquery工具包括在页面的头部，如果我删除这个工程确定。 有没有人设法让这两个一起工作？
问题发布4年后，但也许会帮助其他人遇到这个问题。 答案已经发布在StackExchange elswehere，但我失去了链接，很难find。
解答：在jQueryTOOLS中，如果使用默认的下载，jQuery的“核心”也被embedded。
当你加载jQuery和jQuery工具时，jQuery核心会被定义两次，并且会“解除”任何插件。 “Draggable”（来自jQuery-UI）就是这样一个插件。
解决scheme是使用jQuery工具，而不使用jQuery的“核心”文件，一切都会正常工作。
这个问题也会发生，如果你不加载jqueryui以及jQuery
例如：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js" type="text/javascript"></script>
确保你的代码遵循这个顺序 –
<script src="jquery.min.js"></script> <script src="jquery-ui/jquery-ui.js"></script>
确保你有jQuery对象，而不是元素本身。 如果你按课程select，你可能没有得到你所期望的。
打开一个控制台，看看你的select器代码返回。 在Firebug中，您应该看到如下所示的内容：
jQuery( div.draggable )
你可能不得不进入一个数组并获取第一个元素： $('.draggable').first()然后在这个jQuery对象上调用draggable（），就完成了。
你可以导入这些js文件。 它为我工作得很好。
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js" ></script>
嘿那里，这对我有效（我无法使用你正在使用的Google API链接）：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Beef Burrito</title> <script src="jquery-1.4.2.min.js" type="text/javascript"></script> <script src="jquery-ui-1.8.1.custom.min.js" type="text/javascript"></script> </head> <body> <div class="draggable" style="border: 1px solid black; width: 50px; height: 50px; position: absolute; top: 0px; left: 0px;">asdasd</div> <script type="text/javascript"> $(".draggable").draggable(); </script> </body> </html>
此代码将无法正常工作（您可以检查萤火虫jQuery.ui是未定义）：
<script src="jquery-1.4.2.min.js" type="text/javascript"></script> <script src="jquery-ui-1.8.1.custom.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script>
尝试使用以下代码：
<script src="jquery-1.4.2.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script> <script src="jquery-ui-1.8.1.custom.min.js" type="text/javascript"></script>
这可能对某些人有所帮助：
在我的情况下，我能够通过首先加载可拖动的js文件取决于删除此错误。 他们是ui.mouse.js，ui.core和ui.widget即UI Core Widget Factory鼠标交互
确保加载依赖关系的脚本标签位于可拖动的js加载标签之上。
jQuery的工具和jQuery UI的冲突，因为他们都宣布jQuery.tabs和冲突阻止第二个（在这种情况下，jQuery的UI）加载。 这就是为什么你得到一个draggable is not a function错误。
解决这个问题的办法是创build一个自定义版本的jQuery工具（从这里 ）没有选项卡function。
有关在这里find的冲突的信息： JQuery UI和JQuery工具可以一起工作吗？
代替
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
使用
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js" type="text/javascript"></script>
如果包含正常的jquery库两次，也可能导致此问题。 我的身体和头部有两条线。
直到我试图使用jQuery UI也没有造成任何问题。
造成这个错误的原因通常是因为你可能使用了一个引导框架，并且已经在closuresbody标签的头部或右上方的某个地方包含了一个jquery文件，在这种情况下，你只需要包含jquery ui文件，无论你有jQuery文件，或在两个地方，你会没事的…
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js" type="text/javascript"></script>
只要包含上面的jquery ui脚本，无论您将jquery文件与其他引导依赖关系一起导入。
我有另一个原因相同的问题，我的眼睛需要一个小时才能find。 我有复制粘贴加载jQuery的脚本标签：
<script src="**https**://code.jquery.com/jquery-3.2.1.min.js"></script> <script src="**http**://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
从移动浏览器访问时，我的网站使用https，并拒绝加载没有https的jquery-ui。
