使用 jquery - 2 个不同的链接打开相同的 window 但显示适当的内容？

Question

我试图弄清楚如何使用 jQuery 来实现这一点，我有第 1 页，其中有 2 个链接，即链接 1 和链接 2，我想要实现的是当我单击链接 1 时，一个新的浏览器 window 打开显示内容对于链接 1，当我单击链接 2 时，会显示相同的 window，但会显示链接 2 的内容。

这是创建页面并隐藏两组内容然后在单击相应链接时显示内容的问题吗？

有没有人有类似的教程？

Answer 1

试一试...我使用链接的 rel 属性指向内容，并在这些链接上使用 class ，这允许点击处理程序适用于任意数量的链接/窗口。

<div style="display:none" id="content1">This displays for link1</div>
<div style="display:none" id="content2">This displays for link2</div>
<a class="windowlink" rel="content1" href="#">Link 1</a><br>
<a class="windowlink" rel="content2" href="#">Link 2</a>

<script>
$(document).ready(function() {                       // Standard jQuery wrapper to ensure DOM/jQuery is loaded and ready for use.
 $('.windowlink').click(function() {                 // Assign a function to the Click handler of all elements with a class of 'windowlink'
   var html = $('#' + $(this).attr('rel')).html();   // Builds a jQuery ID selector using the rel attribute of the clicked link, grabs the html content of the div with that name.
                                                     // i.e. link 1 has a rel="content1" so this line will evaluate to var html = $('#content2').html();
   var newwindow = open('');                         //  Open a new window, store the handle
   newwindow.document.write(html);                   // Write the HTML to the new window
   newwindow.document.close();                       // Stop writing, finalize the new window document.
 });
});

工作 JSFiddle： http://jsfiddle.net/gfosco/txMKb/

Answer 2

The Javascript window object has a open(href, name, properties) function, and browsers will only open one window of a given name. 只需在同名的新 window 中打开链接 1 和链接 2 所指的页面，您就会得到想要的结果。

所以，举个例子：

<a href="#" onclick="window.open('page1.html', 'my_window', 'height=100,width=100');return false;">Link 1</a>
<a href="#" onclick="window.open('page2.html', 'my_window', 'height=100,width=100');return false;">Link 2</a>