html - 多个 DIV 的 DIV 交换

Question

从相同的文本链接交换 div 内容

那篇文章几乎包含了我需要回答我的问题的内容。它适用于两个 DIV，如果我有很多怎么办。您将如何更改函数而不必继续为更多变量添加声明行？

Answer 1

如果你可以使用 jQuery，你可以尝试这样的事情：http: //jsfiddle.net/k9JC4/6/

html:

<a class="que">Question 1</a>
<div class="ans">
    Answer 1
</div>
<a class='que'>Question 2</a>
<div class='ans'>
    Answer 2
</div>
<a class='que'>Question 3</a>
<div class='ans'>
    Answer 3
</div>

CSS：

.ans
{
    display: none;
}

a
{
    display: block;
    color: blue;
}

JS：

$(function(){
    $('.que').click(function(ev){
        ev.preventDefault();

        $('.ans').hide();
        $(this).next('.ans').show();
    });
});

这是如何工作的，当你点击一个带有.que类的链接时， jQuery 会找到下一个带有.ans类的兄弟元素。它将隐藏所有其他.ans类成员，然后显示找到的兄弟姐妹。