logo标签列表

从列表中随机选择一个项目

javascriptrandom
4

我正在学习 JavaScript，需要一些帮助。我有一个列表。我试图制作一个列表，在其中你可以通过点击按钮从该列表中获取随机歌曲，但似乎不起作用。我的列表如下，我做错了什么？

<!DOCKTYPE html>
<html>
<head>
</head>
<body>

<div>
  <button type="randomSong">Random Music</button>
  <input "randomSong" id="randomSong">
</div>

<script>

var song = Array("song1", "song2", "song3", "song4", "song5", "song6");

var randomSong = song[Math.floor(Math.random()*song.length)];

</script>

</body>
</html>

1
首先，没有sange变量。另一个问题是您没有对所选歌曲、按钮或输入执行任何操作（其中HTML格式不正确）。 - Asad Saeeduddin
你的JS代码已经可以运行了，你只需要将它放回HTML中，然后就完成了。 - Henrik Andersson
2个回答
9
你的代码几乎正确。这里是一个正确的版本：

HTML

<div>
  <button type="randomSong" onclick="randomSong()">Random Music</button>
  <input name="randomSong" id="randomSong">
</div>

修改：

  • 为输入框添加属性名称（您之前没有为"randomSong"添加任何属性键）
  • 使用onclick回调函数，使得在单击按钮时发生某些事情

JS

var song = Array("song1", "song2", "song3", "song4", "song5", "song6");

function randomSong() {
  var randomSong = song[Math.floor(Math.random() * song.length)];
  document.getElementById('randomSong').value = randomSong;
}

修改：

  • 将您的随机代码包装到函数中（由按钮的onclick属性引用的函数）
  • 将结果分配给输入
-1

下面的方法展示了如何在Javascript中获取随机项：

const songs = ["song1", "song2", "song3", "song4", "song5", "song6"];

function findSong() {
  let randomIndex = Math.floor(Math.random() * songs.length);
  document.getElementById("randomSong").setAttribute("value", songs[randomIndex]);
}
<div>
  <button onclick="findSong();" type="randomSong">Random Music</button>
  <input "randomSong" id="randomSong">
</div>

Shitsu的答案更准确，请给他点赞，因为我还没有足够的声望。 - Emil S. Jørgensen
这个答案是不正确的。因为Math.random()返回一个介于0（包括）和1（不包括）之间的浮点数，将其乘以（song.length-1）（在本例中为5）将给出一个介于0（包括）和5（不包括）之间的数字，并将其向下取整，将给出一个介于0和4之间的整数，完全忽略了最后一项。 - Gabriel
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接