Javascript jQuery sortable 不是一个函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7956420/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery sortable is not a function
提问by CodeRedd
I am trying to make an ordered list of items click-and-draggable with the Sortable jQuery UI plugin version 1.8.16. However, I keep getting the error that $("#ol-id ol").sortable is not a function, with 'ol-id' being the id of the list. My code is as follows:
我正在尝试使用 Sortable jQuery UI 插件版本 1.8.16 制作可单击和拖动的有序项目列表。但是，我不断收到错误消息$("#ol-id ol").sortable is not a function，其中 'ol-id' 是列表的 id。我的代码如下：
//Sorting stuff
if($("#li-id li").size()>1) {
$("#ol-id ol").sortable({
revert: true,
axis: 'y',
containment: 'parent',
cursor: 'move',
handle: 'div.link_div',
smooth: false,
opacity: 0.7,
tolerance: 'pointer',
start: function(){
$("#ol-id").removeClass("bottom_dragged");
},
update: function(){
$("#ol-id ol").sortable({disabled : true});
$("#saving_indicator").html("saving...")
$("#saving_indicator").show();
//do other stuff...
}
})
}
Oddly, the error shows up in Firebug as being on the line with update: function(){.
奇怪的是，该错误在 Firebug 中显示为与update: function(){.
I have verified that this function is called after both the page is loaded and the jQuery UI library is loaded. I am including both jquery-1.6.2.min.js and jquery-ui-1.8.16.custom.min.js in the header. Moreover, I have verified that all id names are correct and match their HTML counterparts.
我已经验证在加载页面和加载 jQuery UI 库之后调用此函数。我在标题中包含 jquery-1.6.2.min.js 和 jquery-ui-1.8.16.custom.min.js 。此外，我已经验证所有 id 名称都是正确的并且与它们的 HTML 对应物匹配。
So if it's not this missing resource-related stuff, what is causing the problem?
因此，如果不是缺少与资源相关的东西，是什么导致了问题？
EDIT: here is my HTML header:
编辑：这是我的 HTML 标题：
<link href="/_css/styles.css?mod=1317745564" type="text/css" rel="stylesheet">
<link href="/_javascript/qtip/jquery.qtip.min.css?mod=1315947301" type="text/css" rel="stylesheet">
<script type="text/javascript" async="" src="http://www.google-analytics.com/ga.js">
<script type="text/javascript" async="" src="http://www.google-analytics.com/ga.js">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">
<link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/start/jquery-ui.css">
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/le-frog/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js" type="text/javascript">
<script src="/_javascript/sets.js?mod=1320080042" type="text/javascript"> //Sorting stuff code is here
<script type="text/javascript" src="http://dev.selfcheck.vudat.msu.edu/_javascript/jquery.jsonp.js">
<script type="text/javascript" src="http://dev.selfcheck.vudat.msu.edu/_javascript/jquery.form.js">
<script type="text/javascript" src="http://dev.selfcheck.vudat.msu.edu/_javascript/qtip/jquery.qtip.min.js">
<link href="/_css/ui/ui.core.css?mod=1315947279" type="text/css" rel="stylesheet">
<link href="/_css/ui/ui.theme.css?mod=1315947280" type="text/css" rel="stylesheet">
回答by Blender
jQuery UI and jQuery must be loaded in a certain order:
jQuery UI 和 jQuery 必须按特定顺序加载：
<script src="jquery.js">...
<script src="jquery-ui.js">...
Make sure you are including jQuery UI after jQuery.
确保在 jQuery 之后包含 jQuery UI。
回答by IonicBurger
So not sure if this will help anyone, but I ran into a similar situation, which I was able to solve. So this seems to happen when either
所以不确定这是否会帮助任何人，但我遇到了类似的情况，我能够解决。所以这似乎发生在
a) the order of loading jQuery-ui and jQuery is wrong.
a) jQuery-ui 和 jQuery 的加载顺序错误。
b) jQuery is being included more than once, or different versions are being included.
b) jQuery 被多次包含，或者不同的版本被包含在内。
Option "b" happened to me because I was using a bootstrap template, where jQuery is included at the bottom of the document, which is of course a best practice, while the code I was testing added a different version of jQuery at the top of the page.
选项“b”发生在我身上，因为我使用的是引导模板，其中 jQuery 包含在文档的底部，这当然是最佳实践，而我正在测试的代码在顶部添加了不同版本的 jQuery这一页。
I see that the code on this question looks like it contains a number of duplicates, so I would suggest cleaning it up as a start.
我看到这个问题的代码看起来包含许多重复项，所以我建议先清理它。
回答by Eric Antoine Scuccimarra
I had the same issue and it was because another js file was being included at the bottom of the page which had some jQuery functions. When I moved this to the top of the page, above my includes of jQuery and jQuery-UI everything works great.
我遇到了同样的问题，这是因为页面底部包含了另一个 js 文件，该文件具有一些 jQuery 函数。当我把它移到页面顶部时，在我包含的 jQuery 和 jQuery-UI 之上，一切都很好。
回答by Brett Pennings
My issue was I was using jQuery(...).sortable() instead of $(...).sortable()
我的问题是我使用jQuery(...).sortable() 而不是$(...).sortable()
Not sure why that mattered, but changing it to $fixed it.
不知道为什么这很重要，但将其更改为$修复了它。
回答by Suresh Suthar
i have found new solution, just edit acf.php file at line number 551
我找到了新的解决方案，只需在第 551 行编辑 acf.php 文件
old
老的
'deps' => array('jquery', 'jquery-ui-core', 'jquery-ui-datepicker', 'underscore', 'select2'),
new
新的
'deps' => array('jquery', 'jquery-ui-core', 'jquery-ui-datepicker', 'jquery-ui-sortable', 'underscore', 'select2'),
i just added jquery-ui-sortablein array
i hope help someone
thank you.
我刚刚添加jquery-ui-sortable了数组，希望能帮到人，谢谢。
