如何播放使用接受导入的音频文件？

Question

我有这个代码的例子

<input type="file" id="thefile1" accept="audio/*" />

我想使用 javascript 播放此音频。我该怎么办？

Answer 1

您可以通过以下两种方式之一执行此操作。由于您要求使用 JavaScript，因此您只需将 autoplay 设置为 true。第二种方法是做同样的事情，但在 video 元素本身上设置 autoplay="true"。

在你的情况下，如果你不想自动播放，你只需要在你的视频元素上运行.play()。

只是为了播放视频

document.getElementById('playButton').addEventListener('click', (e) => {
  const video = document.getElementsByTagName('video')[0];
  video.play();
});

<video width="320" height="240" controls>
  <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

<button id="playButton">Play</button>

自动播放选项

JavaScript 选项

const video = document.getElementsByTagName('video')[0];
video.autoplay = true;

<video width="320" height="240" controls>
  <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

HTML 选项

<video width="320" height="240" controls autoplay="true">
  <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>