是否可以在不链接其他页面的情况下使用iframe

时间:2012-04-19 21:49:09

标签: html iframe

这是经典的iframe代码。我想要的只是在点击不同的链接时显示不同的内容。

我想在带有不同链接的页面上的wordpress中显示不同的图库。我不想为每个人编写不同的html代码

<iframe id="myIframe" src="about:blank" height="200" width="500"></iframe>
<br />
<a href="http://www.blogger.com" target="myIframe">Blogger</a><br />
<a href="http://www.cnn.com" target="myIframe">CNN</a><br />
<a href="http://www.google.com" target="myIframe">Google</a><br />

1 个答案:

答案 0 :(得分:2)

您要做的是在点击链接时显示和隐藏页面的特定部分。你不需要使用iframe。我认为你最好使用隐藏的div,或者甚至是ajax调用加载不同的画廊。我会告诉你隐藏的divs方法:

<div id="gallery1" class="gallery">
  A whole lot of html that makes up the 1st gallery
</div>
<div id="gallery2" class="gallery" style="display:none">
  A whole lot of html that makes up the 2nd gallery
</div>
<div id="gallery3" class="gallery" style="display:none">
  A whole lot of html that makes up the 3nd gallery
</div>

<a href="JavaScript:void(0)" data-gallery="gallery1">Show gallery 1</a>
<a href="JavaScript:void(0)" data-gallery="gallery2">Show gallery 2</a>
<a href="JavaScript:void(0)" data-gallery="gallery3">Show gallery 3</a>

​
$('a').click(function() {
  $('.gallery').hide();
  $('#' + $(this).data('gallery')).show();
});

这是一个js小提琴:http://jsfiddle.net/nV5vy/