当某些单击嵌套在父注释中的图标时,我试图折叠所有子注释,包括父注释。
使用下面的jQuery代码,我可以使注释框折叠,但是现在位于另一部分内的注释也被折叠。
jQuery代码-
$('.comment-toggle pre').on('click', function(e) {
$(".single-comment-wrapper .comment-text, .single-comment-wrapper .comment-bottom, .single-comment-outer .child-comment ").slideToggle('fast', function() {
if ($(this).is(':visible')) {
$(".comment-toggle pre").text('[–]');
} else {
$(".comment-toggle pre").text('[+]');
}
});
});
$('.comment-toggle pre').on('click', function(e) {
$('.single-comment-wrapper .left-side').slideToggle('fast');
});
由于HTML和CSS太长。我已经创建了一个Codepen。以下是它的直接链接。
https://codepen.io/anon/pen/Vzrvbm
提前致谢。
最佳答案
您的div的结构使这个问题变得棘手,我在小提琴上玩了大约10分钟,并提出了这个建议-它的前进方向正确,但并不完美...
$('.comment-toggle pre').on('click', function(e) {
$(this).parents('.single-comment-wrapper').next().slideToggle('fast', function() {
所有的加号和减号都会更改,因为当前您的代码是针对类,因此需要相对于单击的+/-进行更改,因此$(this)。等等