Cod*_*edd 8 javascript sorting jquery-ui jquery-ui-sortable
我正在尝试使用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...
}
})
}
Run Code Online (Sandbox Code Playgroud)
奇怪的是,错误出现在Firebug中,因为它正在线上update: function(){.
我已经验证在加载页面和加载jQuery UI库之后调用此函数.我在头文件中包含了jquery-1.6.2.min.js和jquery-ui-1.8.16.custom.min.js.此外,我已经验证所有id名称都是正确的,并且与HTML对应的名称相匹配.
那么,如果不是这个缺少与资源相关的东西,导致问题的原因是什么?
编辑:这是我的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">
Run Code Online (Sandbox Code Playgroud)
Ble*_*der 14
必须按特定顺序加载jQuery UI和jQuery:
<script src="jquery.js">...
<script src="jquery-ui.js">...
Run Code Online (Sandbox Code Playgroud)
确保在jQuery之后包含jQuery UI.
Ion*_*ger 10
所以不确定这是否会帮助任何人,但我遇到了类似的情况,我能够解决。所以这似乎发生在
a) jQuery-ui 和 jQuery 的加载顺序错误。
b) jQuery 被多次包含,或者不同的版本被包含在内。
选项“b”发生在我身上,因为我使用的是引导模板,其中 jQuery 包含在文档的底部,这当然是最佳实践,而我正在测试的代码在顶部添加了不同版本的 jQuery这一页。
我看到这个问题的代码看起来包含许多重复项,所以我建议先清理它。
我遇到了同样的问题,这是因为页面底部包含了另一个 js 文件,该文件具有一些 jQuery 函数。当我把它移到页面顶部时,在我包含的 jQuery 和 jQuery-UI 之上,一切都很好。
| 归档时间: |
|
| 查看次数: |
40891 次 |
| 最近记录: |