禁用audio进度条拖拽需用JS拦截seeking事件或自定义UI，controlslist="noseek"无效；iOS需监听loadedmetadata后操作currentTime，且原生控件无法隐藏进度条。

audio 标签默认允许拖拽，禁用需移除 controls 或干预原生行为

浏览器原生 的进度条（即 controls 中的滑块）默认可拖拽，没有内置属性能“只禁拖拽、保留其他控件”。想限制快进快退，本质是禁掉时间轴交互——要么不用原生控件，要么用 JS 拦截并重置。

用 controlslist="nodownload nofullscreen noremote" 不起作用

这个属性只能隐藏下载、全屏、远程播放按钮，对拖拽进度条完全无效。Chrome、Edge 支持它，但规范里没定义 noseek 或类似值，所有主流浏览器都不识别 controlslist="noseek"。别白费劲写这个。

真正可行的两种做法：纯 JS 控制 或 自定义 UI

推荐根据需求选一种：

• 如果只要「禁止用户跳转，但允许播放/暂停/音量」，用 JS 监听 timeupdate 和 seeking，检测到跳转就强制回退：

  <audio id="myAudio" src="song.mp3"></audio><script>
  const audio = document.getElementById('myAudio');
  audio.addEventListener('seeking', () => {
    // 用户试图拖拽时触发
    if (audio.currentTime !== audio.duration * 0.5) { // 示例：只允许停在中间
      audio.currentTime = 0; // 强制归零，或设为固定位置
    }
  });
  </script>

• 如果要彻底掌控交互（比如只允许逐秒前进），就不用 controls，自己画按钮 + play()/pause() + 定时器控制 currentTime，同时设 audio.setAttribute('disableRemotePlayback', 'true') 防投屏跳转

注意 iOS Safari 的特殊限制

iOS 上，audio 在非用户手势触发下不能自动播放，且 currentTime 设置可能被静默忽略（尤其未加载完成时）。务必在 canplay 或 loadedmetadata 后再操作：

htmlppt.skill

把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。

下载

audio.addEventListener('loadedmetadata', () => {
  audio.currentTime = 10; // 此时设置才可靠
});

另外，iOS 原生控件无法隐藏进度条部分——哪怕你 JS 拦截了，用户长按仍可能唤出系统跳转菜单。真要强约束，只能走自定义 UI 路线。

最麻烦的点不在代码，而在「用户意图」和「平台策略」的拉扯：浏览器不让你轻易锁死时间轴，因为这违背可访问性原则；而你要限制，就得主动接管全部播放逻辑，包括键盘快捷键（如方向键）、触控手势、甚至系统媒体控件的响应。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！