Javascript 可排序列表-按照正确的顺序进行比较，并将类添加到正确的位置

我想制作一个可排序的拖放列表，在按钮上，将其与实际正确的顺序进行比较（将其想象为完成任务X所需的步骤）。我使用列表ID来实现这一点（对我来说是最简单的方法）

$（函数（）{
$（“#可排序”）。可排序({
卷轴：错，
占位符：“ui状态突出显示”
});
$（“#可排序”）.disableSelection（）；
});
函数checkOrd（）{
var items=$（'#可排序li'）.map（函数（）{
返回$.trim（$（this.attr（'id'））；
}).get（）；
var itsort=$（'#可排序li'）.map（函数（）{
返回$.trim（$（this.attr（'id'））；
}).get（）；
控制台日志（项目）；
控制台日志（itsort）；
itsort.sort（）；
if（JSON.stringify（items）=JSON.stringify（itsort））{
console.log（'good！'）；
}否则{
console.log（'error！'）；
}
};
.ui状态是否正确{
字体大小：粗体；
颜色：#8bd333；
}


1
2
3
4
5
6
7



选中
您可以比较
项
数组和
itsort
数组值，如果给定位置的值相同，只需将类添加到您的
li
即可，即：
$（“#“+”值）。添加类（“ui状态正确”）
，并且您可以在再次开始排序时删除这些添加的类

演示代码：
$（函数（）{
$（“#可排序”）。可排序({
卷轴：错，
占位符：“ui状态突出显示”，
开始：功能（事件、用户界面）{
//每当再次启动可排序时删除类
$（“#可排序li”）.removeClass（“ui状态正确”）
}
});
$（“#可排序”）.disableSelection（）；
});
函数checkOrd（）{
var items=$（'#可排序li'）.map（函数（）{
返回$.trim（$（this.attr（'id'））；
}).get（）；
var itsort=$（'#可排序li'）.map（函数（）{
返回$.trim（$（this.attr（'id'））；
}).get（）；
itsort.sort（）；
//循环阵列
$（项目）。每个（功能（索引、值）{
//检查两个阵列在给定位置是否具有相同的
if（值==itsort[index]）{
//在那里添加类
$（“#”+value）.addClass（“ui状态正确”）
}
})
if（JSON.stringify（items）=JSON.stringify（itsort））{
console.log（'good！'）；
$（“.check”）.text（“良好”）；
}否则{
console.log（'error！'）；
$（“.check”）.text（“错误”）；
}
};
.ui状态是否正确{
颜色：绿色；
}


1
2
3
4
5
6
7



检查
Hello@Swati，谢谢你的回复：）看来你的方法很管用。它几乎完全符合我的要求：）我猜只有当拖动项的位置发生变化时才删除该类有点复杂？当您需要删除该类时，可能是这样？让我知道我会更新我的答案。好的，所以我认为可能在checkOrd（）之后，正确的“答案”变为绿色，当你再次拖动错误的答案时，不要触摸正确答案的顺序（例如1,2,6,7是正确的，5,3,4是错误的），正确的答案保持绿色。就像我用5换了3，然后用5换了4，我没有碰上正确的。它们能保持绿色吗？你可以在这个方法中写下逻辑，如果仍然不起作用，你自己试试，让我知道。