点击 按钮会触发默认跳转行为，导致页面滚动至顶部；通过将 href 替换为 javascript:void(0); 或使用事件阻止机制，可彻底消除该跳转，使页面保持当前位置。
点击 `` 按钮会触发默认跳转行为，导致页面滚动至顶部；通过将 `href` 替换为 `javascript:void(0);` 或使用事件阻止机制，可彻底消除该跳转，使页面保持当前位置。
在 HTML 中，<a href="https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15b"></a> 是一个常见但易被忽视的“陷阱”：它虽无实际目标地址，但浏览器仍会将其解析为“跳转到当前页面顶部（即 ID 为空的锚点）”，从而触发页面意外滚动。这正是您在点击“Pause Video”或“Unpause Video”按钮时页面突然回到顶部的根本原因。
✅ 推荐解决方案：移除默认跳转行为
最简洁、兼容性最佳的做法是将 href="https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15b" 替换为 href="javascript:void(0);"：
<td> <a href="javascript:void(0);" onclick="pauseVideo()" style="font-size: 35px; text-decoration: none;">Pause Video</a> </td> <td> <a href="javascript:void(0);" onclick="unpauseVideo()" style="font-size: 35px; text-decoration: none;">Unpause Video</a> </td>
⚠️ 注意：javascript:void(0) 不会触发任何导航，也不会刷新页面，且在所有现代浏览器中稳定可靠。
? 更现代、语义更优的替代方案（推荐进阶使用）
若追求更好的可访问性与语义化，建议改用 <button></button> 元素代替 <a></a> —— 因为控制视频播放属于操作行为，而非导航链接：
<td>
<button type="button" onclick="pauseVideo()" style="font-size: 35px; padding: 0; border: none; background: transparent; cursor: pointer; text-decoration: none;">
Pause Video
</button>
</td>
<td>
<button type="button" onclick="unpauseVideo()" style="font-size: 35px; padding: 0; border: none; background: transparent; cursor: pointer; text-decoration: none;">
Unpause Video
</button>
</td>
✅ 优势：
- 天然无跳转行为，无需
href折腾； - 更符合 WAI-ARIA 可访问性规范（屏幕阅读器能正确识别为操作控件）；
- 支持键盘回车/空格触发，提升无障碍体验；
- 样式更可控（避免
<a></a>的默认下划线、聚焦轮廓等干扰）。
? 额外提醒
- 原代码中
document.getElementById("myVideo")在脚本执行时可能因 DOM 未加载而返回null。建议将<script></script>移至
