gpt4 book ai didi

javascript - 3 个 iFrame,3 个链接 - 使用 onclick 显示 1 个 iFrame,同时隐藏其他 iFrame

转载 作者:行者123 更新时间:2023-11-27 22:37:01 24 4
gpt4 key购买 nike

我在一页中有 3 个按钮图像,这样当您按 1 时,它应该显示与其相关的 iFrame,并隐藏其他的。我刚开始学习 webdev,我也上网浏览过,但我似乎无法让它工作。 :o

这是我的代码:

<div id="tabs">  
<div id="overview">
<a href="#wrapper">Overviews</a>
</div>
<div id="gallery">
<a href="#wrapper2">Gallery</a>
</div>
</span>
<div id="reviews">
<a href="#wrapper3">Reviews</a>
</div>
</div>

每个 wrapper# 都是包含 iFrame 的 div 的 ID。上面的选项卡 div 中包含的 div 是按钮图像。

如何在第一个显示 1 帧,然后当单击另一个按钮图像时,该 iFrame 将隐藏,并且与单击的按钮对应的 iFrame 将是唯一显示的 1?

非常感谢您! :)

附言您可以查看我的网站 www.giroapps.com 以更好地了解我正在努力实现的目标。 :)

最佳答案

有一个适合您的巧妙解决方案:http://www.stilbuero.de/jquery/tabs_3/

简单示例:

<head>
<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script>
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.tabs.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#tabs").tabs();
});
</script>
</head>
<body>
<div id="tabs">
<ul>
<li><a href="#fragment-1"><span>One</span></a></li>
<li><a href="#fragment-2"><span>Two</span></a></li>
<li><a href="#fragment-3"><span>Three</span></a></li>
</ul>
<div id="fragment-1">
<iframe>IFrame1</iframe>
</div>
<div id="fragment-2">
<iframe>IFrame2</iframe>
</div>
<div id="fragment-3">
<iframe>IFrame3</iframe>
</div>
</div>
</body>

更新

关于您的申请:

<SCRIPT type="text/javascript">
$(document).ready(function(){
$("#tabs a").click( function() {
$("#tabs-1").load(this.href);
return false ;
} ) ;
$("#tabs a:first").click() ;
});
</SCRIPT>

<DIV id="tabs">
<DIV id="overview">
<A class="imagelink lookA" href="./toframe.html">Overviews</A>
</DIV>
<DIV id="gallery">
<A class="imagelink lookA" href="./tawagpinoygallery.html">Gallery</A>
</DIV>
<DIV id="reviews">
<A class="imagelink lookA" href="./trframe.html">Reviews</A>
</DIV>
</DIV>
<div id="tabs-1"></div>

关于javascript - 3 个 iFrame,3 个链接 - 使用 onclick 显示 1 个 iFrame,同时隐藏其他 iFrame,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2079268/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com