html - 显示和附加隐藏的子块以覆盖每个列表项

Question

我有一个有序列表，基本上每个子元素都应该调用默认隐藏的覆盖和显示和列表，我相信我所做的一切都是正确的，但是现在当我单击按钮时，一遍又一遍地显示相同的隐藏 div，不是我点击的按钮的孩子，我创建了一个 jsFiddle http://www.jsfiddle.net/aR7va/1/我会感谢任何帮助。

Answer 1

在此处查看更新的代码：http: //jsfiddle.net/aR7va/6/

您原来的问题是您正在搜索 just $('.user-comment-list')，它正在找到所有四个内容块并将它们添加到覆盖容器中。更新后的代码仅在元素内搜索该类。（正如评论中所建议的那样，将 UL 嵌套在 A 中不是有效代码，因此您可能需要考虑更改它。）此外，我每次都添加了一行来清空 overlay_content_inner，或者内容只是被附加当您单击多个按钮时结束。

$('.my-list li .button').click(function(){
    var button = $(this);
    overlay_content_inner.empty();
    overlay.fadeIn(300,function(){
        button.find('.user-comment-list').css({"display":"block"}).appendTo(overlay_content_inner);
    });
});
btn_remove.click(function(){
    overlay.fadeOut(300,function(){});
});

更新

我重新组织了您的代码并对其进行了一些简化。我没有使用.appendTo()，而是将其更改为.html()，它将 overlay_content_inner 元素的 innerHTML 设置为每个链接的用户评论列表容器中的任何内容。更新小提琴：http: //jsfiddle.net/aR7va/22/