jquery - 切换打开关闭目标列表

Question

设想

一个页面上有多个 UL 列表，每个列表： 1：我想要一个打开/关闭链接 2：我想显示每个列表的不同数量

到目前为止，我可以做（2），但是当我尝试做（1）时，我的打开/关闭会打开页面上的所有内容

在这里设置小提琴：http: //jsfiddle.net/tapiman/WD9nf/2/

$('.show-more a').click(function() {
    $('.toggle-list').find('.toggle-items').slideToggle('fast');
    return false;
});

理想情况下：

a：打开链接可能会在打开时变为“关闭”

b：每个链接只打开相关的UL

c：幻灯片可以更流畅

我在其他线程中看到过这种回答，但通常标记和触发器位于我需要它们的不同位置

提前致谢

.本。

Answer 1

使用 的实例this来查找正确的列表，至于更改文本，只需在切换的回调中进行简单检查即可：

$('.show-more a').click(function() {
    var that = $(this);
    $(this).parent().prev(".toggle-list").slideToggle(function() {
        $(this).is(":visible") ? that.text("Close") : that.text("Open");
    });
    return false;
});

演示：http: //jsfiddle.net/WD9nf/10/

Answer 2

那么你应该找到第closest block-content一个find toggle-items

 $('.show-more a').click(function() {
     $(this).closest('.block-content').find('.toggle-list .toggle-items')
            .slideToggle('fast');
     return false;
 });

小提琴