Javascript 如何使用选项卡标题部分中的图像创建可切换选项卡？

我正在尝试创建一个可切换区域，其中包含选项卡标题部分中的图像。因此，如果我单击标题中的第一个图像，它将显示一些内容。如果我单击行中的下一个图像，它应该切换到下一个内容，依此类推。你知道我该怎么开始吗

---

我查看了引导选项卡，但不确定如何使用它解决我自己的问题

看看这个：

<ul class="nav nav-tabs">
  <li class="active"><a data-toggle="tab" href="#home">Home</a></li>
  <li><a data-toggle="tab" href="#menu1"><img src="http://www.downloadsbyvita.com/images/video.jpg"/></a></li>
  <li><a data-toggle="tab" href="#menu2">Menu 2</a></li>
</ul>

<div class="tab-content">
  <div id="home" class="tab-pane fade in active">
    <h3>HOME</h3>
    <p>Some content.</p>
  </div>
  <div id="menu1" class="tab-pane fade">
    <h3>Menu 1</h3>
    <p>Some content in menu 1.</p>
  </div>
  <div id="menu2" class="tab-pane fade">
    <h3>Menu 2</h3>
    <p>Some content in menu 2.</p>
  </div>
</div>

家
一些内容

菜单1
菜单1中的一些内容

菜单2
菜单2中的一些内容

---

工作烦扰：

无法准确理解您的问题是什么，因为我们没有您的代码，但下面的内容可以帮助您

$（'.imgContent'）.hide（）；
$（'.dataToggle'）。单击（函数（）{
$（'.imgContent'）.hide（）；
$（“#”+$（this.data（“img”））.show（）；
});
li{
显示：内联；
光标：指针；
}
.内容{
边框：1px实心#ccc；
高度：30px；
}


img 1
img 2
img 3

img一期内容
img两个内容
img三大内容
嘿，伊姆戈拉夫！谢谢你的快速回复。你的建议不完全是我想要的，可能是因为正如你提到的，我的描述不太清楚。很抱歉。但有人刚刚回答了我下面的问题。嘿@Raviteja！谢谢你的快速回复。是的，我就是这个意思。谢谢。