在两个不同的框架中打开两个不同的页面答案

【问题标题】：Opening two different pages in two different frames在两个不同的框架中打开两个不同的页面
【发布时间】：2015-12-03 16:25:12
【问题描述】：

我正在尝试制作一个框架网站，并且我正在尝试让一个链接在两个不同的框架中打开一个不同的页面。

所以基本上你点击链接，一个页面（即主页作为 .html 文件）将在左侧的第 1 帧中打开，另一个页面（即某种形式或动画完全不同的 .html 文件）将在右侧的第 2 帧中打开。

请提供 JS 和/或 HTML。我尝试了一种不同的 JS 样式，它是

$('a.yourlink').click(function(e) {
    e.preventDefault();
    window.open('http://yoururl1.com');
    window.open('http://yoururl2.com');
});

（感谢亚当·特尔森）

连同html编码：

<a href="#" class="yourlink">Click Here</a>

虽然我不知道如何在同一个窗口中定位不同的框架，但只有 2 个不同的窗口。

【问题讨论】：

我认为在这种情况下使用 iframe 会是更好的解决方案。
stackoverflow.com/questions/5842040/…

标签： javascript html href frames

【解决方案1】：

在页面中添加两个空 iframe，点击按钮设置它们的 src 属性，如下例所示：

$('a').on('click', function(e) {
  e.preventDefault();
  $('.iframe1').attr('src', 'http://www.test.com');
  $('.iframe2').attr('src', 'http://asdf.com/');
})

iframe {
  width: 49vw;
  float: left;
  height: 100vh;
}
html, body {
  margin: 0;
  padding: 0;
}

a {
  background-color: orange;
  color: black;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9;
  display: block;
  width: 80px;
  padding: 10px;
  text-align: center;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#">GO</a>
<iframe src="" frameborder="0" class="iframe1"></iframe>
<iframe src="" frameborder="0" class="iframe2"></iframe>

【讨论】：