Question

我在左侧边栏上有链接，右侧边栏中有相应的内容，排列在正确的div中。

我想在您点击左侧的链接时一次显示一个div。有谁可以帮我这个东西？

HTML是这样的：

<div id="sidebar2">
       <div id="companyimage"><img src="siteimages/imagetest.jpg"></div>
       <div id="historyimage"><img src="siteimages/imagetest2.jpg"></div>
       <div id="awardsimage"><img src="siteimages/imagetest3.jpg"></div>
       <div id="publications"><img src="siteimages/imagetest4.jpg"></div>
       <div id="portfolio"> Embedded a Issu pdf here . </div>
 </div>

链接显示在侧栏1中。

我使用了jquery，并且能够隐藏一个并显示任何其他的。但是，如果单击随机链接，我不知道该怎么办。我需要隐藏当前的div并显示相应的div。

我使用的脚本是：

<script>
   $(document).ready(function(){
   $("#showpublications").click(function(){
   $("#companyimage").hide();
   $("#publications").fadeIn(1500);
   });
 });
</script>

任何形式的帮助都将受到高度赞赏！

Answer 1

我为你工作了。这是非常基本的，可能需要一些调整，但应该让你在路上。

http://jsfiddle.net/bRFgV/

jQuery：

 $("#sidebar2 div").hide();

 $("#sidebar1 a").click(function(){
     //First hide all the DIVs
     $("#sidebar2 div").hide();

     //Then show the selected one.
     var divtoshow = $(this).attr("href");
     $(divtoshow).show();
 });

HTML：

<div id="sidebar1">
<a href="#companyimage">companyimage</a>
<a href="#historyimage">historyimage</a>
<a href="#awardsimage">awardsimage</a>
<a href="#publications">publications</a>
<a href="#portfolio">portfolio</a>
</div>
<div id="sidebar2">
   <div id="companyimage">companyimage</div>
   <div id="historyimage">historyimage</div>
   <div id="awardsimage">awardsimage</div>
   <div id="publications">publications</div>
   <div id="portfolio"> Embedded a Issu pdf here . </div>
</div>

如何隐藏当前div并在单击按钮时显示新div

1 个答案: