javascript - HTML 链接无法在目标框架中打开

标签 javascript html frameset

最近有人向我寻求有关一组 HTML 页面的帮助,但这些页面未能按预期工作。该设置由一个框架集组成,其中某个框架中显示的链接应该在其他框架中打开。这应该通过 anchor 元素上的目标属性来完成,或者通过包含链接的页面中具有目标属性的基本元素来完成。

问题是链接没有在所需的目标框架中打开,而是在不同的选项卡中打开。

经过一些分析,我发现这种行为是由 Javascript 变量“name”的存在引起的,该变量存在于最初加载到目标框架中的页面上。如果该变量的值与目标框架的名称不匹配,则链接将在新选项卡上打开。如果它与目标框架名称匹配,则链接将按预期在目标框架中打开。

在至少三种浏览器的最新版本中(尝试过 Firefox、Chrome 和 Edge),这种情况始终会发生。

我想知道为什么会这样。

这是该问题的一个小型复制品(也可用 here ),其中包含一个框架集、三个带有初始内容的框架和两个链接。第一个链接 target="two" 在框架“two”中打开。但第二个链接(target="Three")不会在框架“三”中打开,而是在新选项卡中打开。显然,这取决于该框架的初始内容 Three.html 中 Javascript 变量“name”的值。但为什么呢?

index.html:

<html>
  <frameset rows="33%,33%,*">
    <frame name="one"   src="one.html">
    <frame name="two"   src="two.html">
    <frame name="three" src="three.html">
  </frameset>
</html>

one.html:

<html>
  <body>
    frame "one"
    <br>
    <a target="two" href="content.html">show content (target="two")</a>
    <br>
    <a target="three" href="content.html">show content (target="three")</a>
  </body>
</html>

two.html:

<html>
  <body>
    frame "two"
    <script>
      <!--
      var name = "two";
      //-->
    </script>
  </body>
</html>

三.html:

<html>
  <body>
    frame "three"
    <script>
      <!--
      var name = "two";
      //-->
    </script>
  </body>
</html>

content.html:

<html>
  <body>
    content
  </body>
</html>

最佳答案

这样做的原因是,通过在页面中设置变量 name,您将覆盖 Window.name 变量。

Window.name 变量是系统用来确定框架名称的变量。当您覆盖此值并更改它,然后尝试访问具有旧值的框架时,您将被重定向到新选项卡。

关于javascript - HTML 链接无法在目标框架中打开,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61163221/

相关文章:

javascript - 圆 Angular 变成矩形?

javascript - 显示来自外部站点的 html

html - float block 链接在 IE 中损坏

html - Internet Explorer 中的框架集边框问题

html - 框架集在 IE 中不工作

javascript - Angular 和 Jasmine - $scope 函数未定义

javascript - 使用自定义 React hook 获取数据

javascript - Bootstrap 水平导航加 Accordion

javascript - 如何在 HTML 表中获取自动序列号列

javascript - HTML 框架集问题