亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

$(...).sortable 不是函數

$(...).sortable 不是函數

炎炎設計 2023-08-18 16:23:05
我已將可排序和 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>


查看完整回答
反對 回復 2023-08-18
  • 1 回答
  • 0 關注
  • 136 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號