jQuery可排序不是函數

我想使用可排序的jQuery UI插件1.8.16版來製作一個有序的項目列表click-and-draggable。但是，我不斷收到錯誤$("#ol-id ol").sortable is not a function，'ol-id'是列表的id。我的代碼如下：jQuery可排序不是函數

//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... 
     } 
    }) 
}

奇怪的是，錯誤在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">

來源

2011-10-31 CodeRedd

你在jQuery之後加入了jQuery UI嗎？ –

嘗試'$（this）.sortable（{disabled：true}）;''update''內部，只是爲了檢查。 – yoda

我已經驗證jQuery UI是在jQuery之後加載的，問題仍然存在。此外，使用'this'代替正確的id不會消除錯誤。感謝您的建議，但！ – CodeRedd

jQuery UI的和jQuery必須按某種順序加載：

<script src="jquery.js">... 
<script src="jquery-ui.js">...

確保您包括jQuery的後jQuery UI的。

來源

2011-10-31 16:19:09 Blender

我已經驗證JQuery UI是在JQuery之後加載的。不幸的是，問題仍然存在。 – CodeRedd

你可以發佈你的HTML''嗎？ – Blender

非常感謝！有用！ – CaffeineShots

所以不知道這是否會幫助任何人，但我遇到了類似的情況，我能夠解決。所以這似乎發生在

a）加載jQuery-ui和jQuery的順序是錯誤的。

b）jQuery被多次包含，或者包含不同的版本。

選項「b」發生在我身上，因爲我使用的是引導模板，其中jQuery包含在文檔底部，當然這是最佳做法，而我測試的代碼添加了不同版本的jQuery在頁面頂部。

我看到這個問題上的代碼看起來像包含一些重複項，所以我建議將它作爲一個開始清理。

來源

2015-08-02 12:46:46 IonicBurger

我的問題我是用jQuery的（...）排序（），而不是$（...）。排序（）

不知道爲什麼這比什麼都重要，但將其更改爲$固定它。

來源

2016-12-08 17:15:49

我有同樣的問題，這是因爲另一個js文件被包含在頁面的底部有一些jQuery函數。當我將它移到頁面的頂部時，上面包括jQuery和jQuery-UI的一切都很好。

來源

2017-01-17 14:55:16

我找到了新的解決方案，只需編輯acf。行號551

老php文件

'deps'  => array('jquery', 'jquery-ui-core', 'jquery-ui-datepicker', 'underscore', 'select2'),

新

'deps'  => array('jquery', 'jquery-ui-core', 'jquery-ui-datepicker', 'jquery-ui-sortable', 'underscore', 'select2'),

我只是在陣列添加jquery-ui-sortable我希望幫助別人謝謝。

來源

2017-03-31 12:31:07

jQuery可排序不是函數

回答

相關問題