Question

只是一个简单的问题。我是此网站的新用户，但此链接Show/Hide multiple DIVs with Select using jQuery

我只是想知道如何更改代码，使其不是下拉选择而是实际链接。

如果有人能帮助我那将是坏事!!

我到处寻找，这是我能找到的最接近的。

谢谢大家。活泉！

Answer 1

我修改了这个问题的接受答案how to show/hide divs by select.(jquery) OP关联的问题，以便他可以看到两者之间的相似之处。正如有人指出的那样，这个命名惯例并不好。

<强>标记

<a id="1" href="#">Link one</a>
<a id="2" href="#">Link two</a>
<a id="3" href="#">Link three</a>


<div id="div1">content here 1</div>
<div id="div2">content here 2</div>
<div id="div3">content here 3</div>

<强> JS

$(function(){
    $('#div1, #div2, #div3').hide();

    $('a').click(function() {
       $('#div1, #div2, #div3').hide();
       $('#div' + $(this).attr('id')).show();
    });
}

<强>演示 http://jsfiddle.net/kJGcE/

这是一个更好的方式

<强>标记

<a class="divHide" href="#">Link one</a>
<a class="divHide" href="#">Link two</a>
<a class="divHide" href="#">Link three</a>


<div class="divShow">content here 1</div>
<div class="divShow">content here 2</div>
<div class="divShow">content here 3</div>

<强> JS

$('a.divHide').click(function() {
   $('.divShow').hide();
   $('.divShow').eq($(this).index()).show();
});

<强>演示 http://jsfiddle.net/kJGcE/2/

修改现有问题的答案

1 个答案: