Question

这是我的代码：

<a class="clickMe">Text 1</a>
<br />
<div class="sri"> - This text will be toggled</div>

<a class="clickMe">Text 2</a>
<br />
<div class="sri"> - This text will be toggled 2</div>

和Jquery

$(function () {
    $('a.clickMe').click(function () {
        // find first of following DIV siblings
        // with class "textBox" and toggle it
        $(this).nextAll('div.sri:first').toggle();
    });
});

现在通过显示'此文本将被切换'并通过隐藏'此文本将在切换2'时单击Text1，但我希望它以oppsite方式工作，即，它应该隐藏'此文本将被切换'并在单击Text1时显示'此文本将被切换为2'。请帮我解决这个问题。

Answer 1

使用此

$(function () {
$('a.clickMe').click(function () {
    // find first of following DIV siblings
    // with class "textBox" and toggle it
       $('div.sri').eq(1).toggle();
});
});

Answer 2

试试这个：

html：

<a class="clickMe a1">Text 1</a>
<br />
<div class="a2"> - This text will be toggled</div>

<a class="clickMe a2">Text 2</a>
<br />
<div class="a1"> - This text will be toggled 2</div>

js：

$(function () {
$('a.clickMe').click(function () {

    var class1 = $(this).attr("class").split(" ")[1];
    $("div." + class1).toggle();
});
});

Answer 3

为什么需要额外的课程来解决你的问题

    $('a.clickMe').click(function () {
        // find first of following DIV siblings
        // with class "textBox" and toggle it
$(this).nextAll('div.sri:first').show();        
$('div.sri:visible').not($(this).nextAll('div.sri:first')).toggle();

    });

live demo

使用div切换页面中的不同文本

3 个答案: