我想制作可排序的拖放列表，并在按鈕上 - 將其與實(shí)際正確的順序進(jìn)行比較（將其想象為完成任務(wù) X 所需的步驟）。我使用列表 ID 來(lái)做到這一點(diǎn)（對(duì)我來(lái)說(shuō)是最簡(jiǎn)單的方法）。$(function() { $("#sortable").sortable({ scroll: false, placeholder: "ui-state-highlight" }); $("#sortable").disableSelection();});function checkOrd() { var items = $('#sortable li').map(function() { return $.trim($(this).attr('id')); }).get(); var itsort = $('#sortable li').map(function() { return $.trim($(this).attr('id')); }).get(); console.log(items); console.log(itsort); itsort.sort(); if (JSON.stringify(items) == JSON.stringify(itsort)) { console.log('good!'); } else { console.log('wrong!'); }};.ui-state-correct { font-weight: bold; color: #8bd333;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script><ul id="sortable"> <li id="dd01" class="ui-state-default">1.</li> <li id="dd02" class="ui-state-default">2.</li> <li id="dd03" class="ui-state-default">3.</li> <li id="dd04" class="ui-state-default">4.</li> <li id="dd05" class="ui-state-default">5.</li> <li id="dd06" class="ui-state-default">6.</li> <li id="dd07" class="ui-state-default">7.</li></ul><p class="check"></p><button onclick="checkOrd();">check</button>正如你所看到的，我得到了做 D&D 列表并檢查一切是否到位的部分。我還想要的是：如果整體順序錯(cuò)誤，我想將 addClass("ui-state- Correct") 添加到正確排序的元素中。就像正確的順序顯然是 1,2,3 并且如果用戶單擊按鈕并且他的順序是 1,3,2 - 我想將類(lèi)“ui-state- Correct”添加到 id dd01 的元素中。否則 - 由于用戶可以多次檢查訂單，如果他弄亂了正確的答案，我想取消“ui-state- Correct”課程:)https://jsfiddle.net/mjro3vba/3/ 為了方便起見(jiàn):)
可排序列表 - 與正確的順序進(jìn)行比較并將類(lèi)添加到正確的位置
翻閱古今
2023-10-20 16:15:23
