JQuery UI 'draggable is not a function' 未捕获的类型错误

Question

我试图使用JQuery可拖动的行在一个表内，但不断收到错误'$(…)。Draggable不是一个函数。在我的代码中，我检查了JQuery和JQuery UI(3.6.0和1.12.1)的版本，并且在我尝试使用可拖动功能之前，它们已经加载。我可以在主体上使用sortable，它工作得很好，所以我不知道这个错误是从哪里来的。如有任何帮助，我将不胜感激。

HTML

<table>
<tbody>
<tr>1</tr>
<tr>2</tr>
<tr>3</tr>
<tr>4</tr>
</tbody>
</table>

JS

$(function() {
if (window.jQuery && window.jQuery.ui) {
$("tr").draggable({
appendTo: "tbody",
helper: "clone"
});
}
});

Answer 1

考虑下面的例子:

$(function() {
if (window.jQuery && window.jQuery.ui) {
$("table tbody tr").draggable({
appendTo: "tbody",
helper: "clone"
});
}
});

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<table>
<tbody>
<tr>
<td>Item 1</td>
</tr>
<tr>
<td>Item 2</td>
</tr>
<tr>
<td>Item 3</td>
</tr>
<tr>
<td>Item 4</td>
</tr>
</tbody>
</table>

本例中的每一行都是可拖动的。