Question

好的，我正在用jQuery / javascript构建一个测验应用程序。

以下小功能旨在随机化一系列问题的可能答案，以及一系列照片。每张照片对应一个答案。

在我调用此功能之前，照片和答案在每个相应的包装集中的顺序相同。

函数随机化两组。但是每个人都是随机分开的。我需要他们两个进行SAME随机化。

我无法弄清楚如何实现这一目标。我认为可能能够将它们链接到jQuery样式，但那是不对的。我也尝试在sort（）中分离出函数，但这也没有做到。

有人可以帮忙吗？

function randomize() {
    var elemsPhotos = $('.photos').children('img').get();
    var elemsQuests = $('.answers').children('.answerLine').get();
    elemsPhotos.sort(function() { return (Math.round(Math.random())-0.5); });
    elemsQuests.sort(function() { return (Math.round(Math.random())-0.5); });
    $('.photos').remove('img');
    $('.answers').remove('.answerLine');
    for (var i=0; i < elemsQuests.length; i++) {
        $('.photos').append(elemsPhotos[i]);      
        $('.answers').append(elemsQuests[i]);      
    }
}

Answer 1

如果它们以对进入，您是否可以使用 div 来保存它们并将div的顺序随机化？

否则，您可以编写随机函数来生成序列。即1,4,2,3作为指数，然后将照片和答案按顺序排列？

元素1-＆gt;位置1

元素2-＆gt;位置4

元素3-＆gt;位置2

元素4-＆gt;位置3

Answer 2

为什么不用n值随机化数组（其中n是问题/照片的数量）并使用该数组在每个问题/照片中获取“随机”索引阵列

var elemsPhotos = $('.photos').children('img').get();
var elemsQuests = $('.answers').children('.answerLine').get();
var n = elemsQuests.length;
var randomIndexes = [];
for (var i=0; i<n; i++) {
   randomIndexes[i] = i;
}
randomIndexes.sort(function() { return (Math.round(Math.random())-0.5); });

$('.photos').remove('img');
$('.answers').remove('.answerLine');
for (var i=0; i < n; i++) {
    $('.photos').append(elemsPhotos[randomIndexes[i]]);      
    $('.answers').append(elemsQuests[randomIndexes[i]]);      
}

Answer 3

你可以随机化（照片，任务）对：

var photos = $('.photos').children('img').get();
var quests = $('.answers').children('.answerLine').get();

var pairs = [];
for (var i=0; i < quests.length; i++)
  pairs[i] = { photo: photos[i], quest: quests[i] };

// randomize 'pairs' any way you like

$.each(pairs, function(i, val) {
  $('.photos').append(val.photo);      
  $('.answers').append(val.quest);  
});

如何使用相同的随机排序对两个数组进行排序

3 个答案: