gpt4 book ai didi

javascript - 随机 jQuery.sortable,将项目放置在正确的位置吗?

转载 作者:行者123 更新时间:2023-11-28 00:29:25 25 4
gpt4 key购买 nike

我将其构建为在线学生的 self 检查。真正的内容是对历史事件进行排序。

现在我有一个随机列表,然后变成可排序列表。我什至将其设置为当任何元素掉落时,它都会检查整个元素的顺序是否正确。请参阅 jsfiddle:

http://jsfiddle.net/kking/ptgxedhh/2/

    var ul = document.querySelector('ul');
for (var i = ul.children.length; i >= 0; i--) {
ul.appendChild(ul.children[Math.random() * i | 0]);
}
var correctOrder = ["one", "two", "three", "four", "five", "six"];
$("#sortable").sortable({
stop: function (event, ui) {
console.log("item dropped");
var order = $(this).sortable('toArray');
console.log(order);
for (i = 0; i < correctOrder.length; i++) {
if (correctOrder[i] == order[i]) {
console.log(i + " correct!");
} else {
console.log(i + " incorrect!");
break;
}
}
}
});
$("#sortable").disableSelection();

接下来我需要它做的是检查最后掉落的元素是否位于正确的位置。我不知道从哪里开始,除了我知道它属于停止功能。我不确定使用我的数组是否更好,并询问放置的项目是否与正确的顺序数组处于相同的位置..或其他方法。说实话,我不确定如何获得该掉落元素的数组位置。

感谢任何帮助或指示!

最佳答案

您可以使用ui.item.index()删除索引。

$(document).ready(function () {
var ul = document.querySelector('ul');
for (var i = ul.children.length; i >= 0; i--) {
ul.appendChild(ul.children[Math.random() * i | 0]);
}
var correctOrder = ["one", "two", "three", "four", "five", "six"];
$("#sortable").sortable({
stop: function (event, ui) {
console.log("item dropped");
var order = $(this).sortable('toArray');

var droppedIndex = ui.item.index();
if (order[droppedIndex] === correctOrder[droppedIndex]) {
alert('Correct!');
} else {
alert('Incorrect.');
}

for (i = 0; i < correctOrder.length; i++) {
if (correctOrder[i] === order[i]) {
console.log(i + " correct!");
} else {
console.log(i + " incorrect!");
break;
}
}
}
});
$("#sortable").disableSelection();
});
 ul {
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 10px;
}
li {
margin: 5px;
padding: 5px;
width: 150px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<link href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<ul id="sortable">
<li class="ui-state-default" id="one">1</li>
<li class="ui-state-default" id="two">2</li>
<li class="ui-state-default" id="three">3</li>
<li class="ui-state-default" id="four">4</li>
<li class="ui-state-default" id="five">5</li>
<li class="ui-state-default" id="six">6</li>
</ul>

关于javascript - 随机 jQuery.sortable,将项目放置在正确的位置吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29154436/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com