隐藏<audio>上下文菜单

Question

我正在为我的儿子创建一个PHP程序，在那里我使用组件音频。但是我想防止他使用上下文菜单下载音频文件。

属性控制着显示或隐藏所有内容，因此这不是我需要的。我想要的东西比JavaScript函数更简单。

我这样使用：

<audio controls src="music.wav"></audio>

Answer 1

您可以将controlsList="nodownload"添加到<audio>标签中以隐藏下载按钮(至少在Chrome上(

<div class="positionRelative">
  <audio controls src="https://ccrma.stanford.edu/~jos/wav/viola.wav" controlsList="nodownload"></audio>
  <div class="styleAudio"></div>
</div>

Answer 2

我找到了一个解决方案：我隐藏了音频组件的右端：

<div class="positionRelative">
  <audio controls src="music.wav"></audio>
  <div class="styleAudio"></div>
</div>

样式：

.positionRelative { position : relative; }
.styleAudio
{
  background : #F2F2F2;
  position : absolute;
  top : 0;
  right : 0;
  width : 2.8em;
  height : 3.4em;
  border-radius : 2.8em;
}