我已将可排序和 jquery 引用导入到我的 html 中，但是，它说未捕获的类型错误：$(...).sortable 不是函数和未捕获的错误：jquery-sortablejs 需要 jQuery我以前从未使用过 jquery，因此对这一切都很陌生。我已将这个确切的代码作为该网站的演示，它可以在代码笔上运行，但无法在我自己的笔记本电脑上运行。$('.sortable-list').sortable({ connectWith: '.sortable-list', update: function(event, ui) { var changedList = this.id; var order = $(this).sortable('toArray'); var positions = order.join(';'); console.log({ id: changedList, positions: positions }); }});<html> <script src="https://cdn.jsdelivr.net/npm/sortablejs@latest/Sortable.min.js"></script><script src="https://cdn.jsdelivr.net/npm/jquery-sortablejs@latest/jquery-sortable.js"></script><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><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script><script type="text/javascript" src="/Users/rankWebsite/js/main.js"></script><body> <h1> Rank Images</h1><ul id="image-list1" class="sortable-list"> <li id="a">A</li> <li id="b">B</li> <li id="c">C</li> </ul></body></html>
1 回答
德玛西亚99
TA贡献1770条经验 获得超3个赞
您的代码的问题是由于脚本引用的顺序造成的。任何依赖 jquery.js 的脚本都必须包含在 jQuery 之后的页面中。此外，您还包含两个版本的 jQuery，这可能会导致问题。我建议保留 3.5.1 并删除 1.12.4。尝试这个：
$('.sortable-list').sortable({
connectWith: '.sortable-list',
update: function(event, ui) {
var changedList = this.id;
var order = $(this).sortable('toArray');
var positions = order.join(';');
console.log({
id: changedList,
positions: positions
});
}
});
<script src="https://cdn.jsdelivr.net/npm/sortablejs@latest/Sortable.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-sortablejs@latest/jquery-sortable.js"></script>
<h1> Rank Images</h1>
<ul id="image-list1" class="sortable-list">
<li id="a">A</li>
<li id="b">B</li>
<li id="c">C</li>
</ul>
添加回答
举报
0/150
提交
取消