javascript - 如何使 javascript 显示随机名称而不重复?

标签 javascript html arrays loops random

我需要能够单击一个按钮,然后以随机顺序出现几个不同的名称,而不会重复任何名称。显示随机名称很简单,但我无法避免重复。这是我所拥有的,但我不明白为什么它不起作用。

<script>

var players = []
players[0] = "Billy";
players[1] = "Alex";
players[2] = "Kevin";
players[3] = "Fred";

function tournament(amount) {
    var a = 0, i = 0, place = 1;
    randomlyselect:
    while (a<amount) {
        var randomplayer = Math.floor(Math.random()*(players.length));
        if (players[randomplayer] === document.getElementById('player1').innerHTML || document.getElementById('player2').innerHTML || document.getElementById('player3').innerHTML) {
            continue randomlyselect;
            } 
        else {
            document.getElementById('player'+place).innerHTML = players[randomplayer];
            place++;
            a++;
        }
    }

}

</script>

<button onClick="tournament(4)">Tournament Results</button>

<p id="player1"></p>
<p id="player2"></p>
<p id="player3"></p>
<p id="player4"></p>

我知道问题出在 if 语句上,但我不知道还有什么方法可以检查名称是否已显示。如果您知道我检查是否已选择某些东西的方法有什么问题或避免重复的更好方法,请告诉我。

最佳答案

var players = []
players[0] = "Billy";
players[1] = "Alex";
players[2] = "Kevin";
players[3] = "Fred";


function tournament(amount) {
  var randomOrder = shuffle(players)
  var count = Math.min(amount, randomOrder.length)
  for (var i = 0; i < count; ++i) {
    document.getElementById("player" + (i + 1)).textContent = randomOrder[i]
  }
}

// http://stackoverflow.com/a/2450976/4339170
function shuffle(array) {
  var currentIndex = array.length,
    temporaryValue, randomIndex;

  // While there remain elements to shuffle...
  while (0 !== currentIndex) {

    // Pick a remaining element...
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex -= 1;

    // And swap it with the current element.
    temporaryValue = array[currentIndex];
    array[currentIndex] = array[randomIndex];
    array[randomIndex] = temporaryValue;
  }

  return array;
}
<button onClick="tournament(4)">Tournament Results</button>

<p id="player1"></p>
<p id="player2"></p>
<p id="player3"></p>
<p id="player4"></p>

关于javascript - 如何使 javascript 显示随机名称而不重复?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34450574/

相关文章:

html - css:带有垂直居中文本的溢出侧 div 表现奇怪

javascript - 如何使用 jQuery 选择这个子 div 元素来显示/隐藏?

javascript - JS For 循环在调用函数后提前停止

javascript - 为什么JavaScript函数调用中没有(){括号}

javascript - 从 Swift 4 向 Node.js 发送发布请求

javascript - 我如何在 React Native 中触发 sibling 之间的 Action ?

javascript - 将数据从 html 表单发送到 php 脚本并将结果返回到 ajax/js/jquery

java - 循环遍历列表 - 当索引到达末尾时,从 0 开始

arrays - 使用 CodeIgniter 2.0 上传多个文件(数组)

c# - 检测字节数组C#的编码