每次重新加载网页时如何重新加载视频

Question

我想要一个可以在每次重新加载页面时更改背景的功能，但它不起作用。

 <script  type="text/javascript">
  var source = document.getElementById('video-source');
  var videos = [
  "videos/vid1.mp4",
  "videos/vid2.mp4",
  "videos/vid3.mp4"
];

  var randomVideo = videos[Math.floor(Math.random() * 3)];

source.setAttribute('src', randomVideo);
</script>
  

Answer 1

实际上，似乎代码在每次页面刷新时都会运行并更新您的视频源，但由于数组太小（尽管您的随机方法为每个元素提供了机会）它可能总是选择一个相同的
您可以尝试使用arr[Math.floor(Math.random() * 10000) % arr.length] 从小数组中选择随机元素。如果它不起作用，请将行 debugger; 添加到您的 js 的开头并逐步调试它，这样您就可以确保您的代码在页面重新加载时再次运行。

如果您想确保选择的视频与上一个不同，您可以使用以下代码选择视频网址：

function selectRandomElement(arr) { //assume arr contains at least two elements
    var res;
    while((res = arr[Math.floor(Math.random() * 10000) % arr.length]) == localStorage['lastVideo']);

    localStorage['lastVideo'] = res;
    return res;
}