如何删除 HTML5 音频标签中的下载选项？

Posted 2023-02-25

【中文标题】如何删除 HTML5 音频标签中的下载选项？

【英文标题】：How do I remove the download option in the HTML5 audio tag?

【发布时间】：2017-02-28 19:25:32

【问题描述】：

我正在维护的网站上使用 html5 音频标签。我注意到音频标签中嵌入了一个下载图标。如何删除该选项？我只想读取（播放）音频。有没有办法在没有 javascript 或 jQuery 的情况下做到这一点？两个我都不知道。

【问题讨论】：

如果您希望将其用作复制保护：没那么简单。为了读取（播放）音频，浏览器必须已经下载文件（可能是磁盘上的临时文件）。从那里将其保存到更永久的文件是一个简单的步骤......

什么浏览器？您是否使用了提供自己 UI 的媒体库（即不是由 HTML <audio> 元素提供的控件）？您可以在问题中提供屏幕截图吗？ （或者，如果因为您是新用户而不让您使用，您可以链接到屏幕截图吗？）

【参考方案1】：

要从 UI 中删除下载选项，请添加 controlsList="nodownload" 属性

        <audio
           controls
           controlsList="nodownload">

        </audio>

【参考方案2】：

audio 元素界面上没有任何东西只控制下载按钮。有controls属性，它是一个布尔属性，只是显示或隐藏音频UI上的所有控件。

【参考方案3】：

试试这个可能对你有帮助。这不是最好的方法，但我认为它会解决您的问题。

audio::-webkit-media-controls-enclosure 
    overflow:hidden;


audio::-webkit-media-controls-panel 
    width: calc(100% + 30px); /* Adjust as needed */

【讨论】：

谢谢！这正是我想要的！