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

Question

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

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

JS and/or 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>

虽然我不知道如何在同一个 window 中定位不同的帧，但只有 2 个不同的 windows。

Answer 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>

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

Opening two different pages in two different frames

html

javascript

frames

href