爲什麼我的.draggable方法返回一個錯誤？

我想製作一個自定義滾動條，並且我的JavaScript應該可以使滾動條拖動不起作用。（我正在使用Chrome來測試它）爲什麼我的.draggable方法返回一個錯誤？

爲什麼這會返回一個錯誤？

// JavaScript Document 
    $(document).ready(function(){ 
     $("#scrollbar-piece").draggable({axis: "y"}); 
     Uncaught TypeError: undefined is not a function 
    })

下面是HTML：

<head> 
    <meta charset="utf-8"> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    <script src="theScriptThatHasAProblem.js"></script> 
</head> 
<body> 
    <div class="page-container">...</div> 
    <div id="scrollbar"> 
     <div id="scrollbar-piece"></div> 
    </div> 
</body>

來源

2014-04-10 An Original Alias

你錯過了一個腳本包括？ jqueryUI也許？ – n8wrl

你只包括基本jQuery庫

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

使用jQuery draggable & droppable包括也

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>

編輯：還要確保腳本的順序是正確的。 jQuery必須在jQuery UI之前加載，因爲它依賴於它。

看看這個小提琴：http://jsfiddle.net/8YEyc/

來源

2014-04-10 20:01:45 Dropout

我添加了它，但它仍然返回了錯誤 –

您是否在jQuery UI之前加載jQuery？ – Dropout

可拖動的是，你沒有提到的jQuery用戶界面庫的一部分。

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>

Google CDN information

draggable documentation

來源

2014-04-10 20:00:25 Brocco

有沒有googleapis的鏈接？ –

@AnOriginalAlias我更新了我的答案，以顯示CDN參考和鏈接到可拖動的文檔 – Brocco

你缺少的jQuery UI庫。 draggable是jquery-ui的一個組件，這不是jQuery的一部分。
您可以從https://jqueryui.com/下載穩定版本。或者，你可以直接包括從谷歌API如下：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

來源

2014-04-10 20:00:52

爲什麼我的.draggable方法返回一個錯誤？

回答

相關問題