Javascript 在jsson图像滑块之间切换（显示一个，隐藏其他）

我需要创建一个带有缩略图的图像滑块

我用过，效果很好

问题是我想在不同的ID下显示一组不同的图像

例如，当任何一年（201320142015）被点击时，我需要显示其下的国家名称；当点击任何国家时，都会显示相关的图像滑块

问题是当点击时，国家名称会消失

我如何使它们保持可见

---

2015







项目一
项目二
项目三

###

---

这就是你想做的吗？只需删除关闭其他列表的脚本。

代码中没有ID为

weed

或

daba

的元素，并且

getElementById

返回

null

。关联元素在哪里？标记非常混乱，并且缺少任何连贯的结构。对不起！新的堆栈溢出和编码…谢谢！你已经给我展示了一些方法，但当我点击2014时仍然是个问题，它再次展示了2015年的div。。

  <p>2015</p>
</a>

<div id="list1" class="alist" style="display:none;">
  <ul>
    <li><a href="#"  onclick="toggle_visibility('list');">
  <p>India </p>
</a></li>
    <li><a href="#" onclick="toggle_visibility('weed');">
  <p>U.S </p>
</a></li>
    <li><a href="#" onclick="toggle_visibility('daba');">
  <p>japan </p>
</a></li>
  </ul>
</div>
<a href="#" onclick="toggle_visibility('list2');">
  <p>2014</p>
</a>
<div id="list2" class="alist" style="display:none;">
  <ul>
    <li>Item One</li>
    <li>Item Two</li>
    <li>Item Three</li>
  </ul>
</div>###

function toggle_visibility(id) {
        var thelist = document.getElementsByClassName("alist");

        var e = document.getElementById(id);
        if(e.style.display == 'block') {
            e.style.display = 'none';
        } else {
            e.style.display = 'block';
        }

    }