在 iPhone 上退出 iframe s3 视频时网站返回页面

Question

每当我点击左上角的

X

关闭全屏视频时，网站就会返回一个页面。此行为仅发生在 iPhone 上，而不发生在 Android 或笔记本电脑上的浏览器上（我还没有测试过 MacBook）。相关

div

代码部分：

<div class="container-fluid first-cont">
   <div class="container columns"> 
       <div class="iframe-container">
           <iframe src="{{ user.video_url }}" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen frameborder="0"></iframe>
       </div>
   </div>
</div>

我该如何解决这个问题？ html 中的标头是否会导致这种效果：

<script defer src="https://use.fontawesome.com/releases/v5.0.7/js/all.js"></script>

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap" rel="stylesheet">

<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@700&display=swap" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/circletype.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

Answer 1

尝试创建一个自定义关闭按钮，并尝试使用 event.preventDefault 在此按钮中设置单击功能，以防止网络浏览器中的默认操作。但如果您更喜欢隐藏原始 iframe 关闭按钮，请尝试使用网络浏览器检查器获取 id 或类名称以隐藏她。