Question

我对编码很陌生，所以如果我的问题很愚蠢，请耐心等待（并且请将任何答案写成代码，否则我将不会得到它......）。我正在进行Qualtrics调查页面，其中有两个可选答案 - 每个答案都是一个项目列表。我试图改变列表，以便每个参与者以不同的顺序查看它们。我从网上获得了以下这些代码。

我的HTML列表如下所示：

<div id="enriched">
    <div class="list_item">lots of sunshine</div>
    <div class="list_item">gorgeous beaches and coral reefs</div>
    <div class="list_item">ultra-modern hotel</div>
    <div class="list_item">very cold water</div>
    <div class="list_item">very strong winds</div>
    <div class="list_item">no nightlife</div>
</div>

我的javascript代码是这样的：

var list = document.getElementById("enriched");
function shuffleNodes() {
    var nodes = list.children, i = 0;
    nodes = Array.prototype.sort.call(nodes);
    while(i < nodes.length) {
       list.appendChild(nodes[i]);
       ++i;
    }
}
shuffleNodes();

但是，它只会从原始版本中删除一次列表。之后，每个下一个参与者都会看到该版本没有进一步的洗牌。之后，我需要以某种方式使它适用于两个列表..我有点紧张。

我也试过一个数组代码，但是我无法使它工作。

Answer 1

正如函数名称所示，行nodes = Array.prototype.sort.call(nodes);不会对内容进行随机播放 - 它会对其进行排序。所以每次都会得到一致的订单。

您可能希望看到How to randomize (shuffle) a JavaScript array?进行改组实施。

Answer 2

这应该创建一个新的random_list数组：

var random_list = [];

for ( i = 0; i < nodes.length; i ++ ) {
  random_list.push( nodes[i].innerHTML );
}

random_list.sort( function() {
  return Math.random() - 0.5;
});