Question

嗨：我是Java和HTML的新手，我一个人学习了一个月。我正在做一个小项目，当我单击一个按钮时，表格中会出现3个随机锻炼练习。我将附加代码以显示到目前为止的内容。

问题：运行for循环时，它将打印相同的随机选择的项目3次，而不是3个不同的项目。

目标：当我单击按钮时，该数组将打印3个不同的数组值。

var workouts = ['situps', 'planks', 'hollow rock']
var copy = workouts.slice();

var table = '';
var i = 1;

for(var j = 0; j < i; j++)
{
    var answer = copy.splice(Math.floor(Math.random()*workouts.length), 1); 
    table += '<tr>';
    table += '<td>';
    for(var i = 0; i < 1; i++){
        table += answer;
    }
    table += '</td>';
    table += '</tr>';
}

function potato() {
document.getElementById('hi').innerHTML += ('<table border = 1>' + table + '</table>');
}

//Output: Sit ups, Sit ups, Sit ups

Answer 1

您好，欢迎来到Stackoverflow。

由于您的for循环，导致代码显示相同输出的问题正在发生。您仅进入循环一次，因为i变量为1。

您真正想做的是拥有与您要显示的元素数量一样多的循环。

一种显示数组中3个唯一且随机元素的方法如下：

var workouts = ['situps', 'planks', 'hollow rock'];
var copy = workouts.slice();

var table = '';

for(var j = 0; j < 3; j++) {
  var random = Math.floor(Math.random() * copy.length);
  var answer = copy[random];

  table += '<tr>';
  table += '<td>';
  table += answer;
  table += '</td>';
  table += '</tr>';

  //Removing the selected element so it won't show again.
  copy.splice(random, 1);
}

function potato() {
   document.getElementById('hi').innerHTML += ('<table border = 1>' + table + '</table>');
}

从数组中随机选择值，无需重复

1 个答案: