Jquery使用PrevAll查找上一个跨度

时间:2014-04-06 23:50:58

标签: jquery html

您好我希望这个jsfiddle正常工作。

我的目标是让已点击的span内的h2也用数据切换文字。

我有大量数据以下面的方式格式化,但是对于这个例子,我只显示了三个ul集。

谢谢。

(以下现有代码或上面的jsfiddle链接)

JQUERY

$(document).ready(function() {
    $(".abc").click(function(){
        $(this).nextAll('ul:first').slideToggle(500, function() {
            $(this).prevAll('span:first').text($(this).is(':visible') ? "- Hide data" :     "- Show data");
        });
    });
});

HTML

<h2 class="abc">click1 <span>- Hide data</span></h2>
<p>text</p>
<ul>
    <li>data</li>
</ul>
<h2 class="abc">click2 <span>- Hide data</span></h2>
<p>text</p>
<ul>
    <li>data</li>
</ul>
<h2 class="abc">click3 <span>- Hide data</span></h2>
<p>text</p>
<ul>
    <li>data</li>
</ul>

1 个答案:

答案 0 :(得分:1)

尝试:

$(document).ready(function() {
    $(".abc").click(function(){
        var that = $(this);
        that.nextAll('ul:first').slideToggle(500, function() {
            that.find('span:first').text($(this).is(':visible') ? "- Hide data" : "- Show data");
        });
    });
});

<强> jsFiddle example