在一个网站上使用两个淡入淡出

我想在同一网站上的两个分开的div上使用fadeToggle，但只有一个可以使用。我可以停用一个，然后另一个运行，但不能同时运行。所以，如果用户点击comment-reply-btn评论输入字段应显示，如果他点击show-subcom-btn评论应显示。我有这样的标题：在一个网站上使用两个淡入淡出

$(".comment-reply-btn").click(function(event){ 
    event.preventDefault(); 
    $(this).parent().next(".comment-reply").fadeToggle().delay(1000); 
}) 

$(".show-subcom-btn").click(function(event){ 
    event.preventDefault(); 
    $(this).parent().next(".show-subcom").fadeToggle().delay(1000); 
})

和这里有两个div我想显示为每次点击。

<div class="show-subcom hhh2" style="display: none;" > 
    {% for child_comment in comment.children %} 
    <blockquote> 
    <img src="{{ child_comment.user.usersettings.profileimage.url }}" class="childcommentpic"> 
<a href="/profiles/{{child_comment.user}}">{{child_comment.user}}</a> <span>{{child_comment.timestamp}}</span><br> 
    <span>{{child_comment.content }}</span> 

    </blockquote> 
    {%endfor%} 
    </div> 

    <div class="comment-reply" style="display: none;"> 
    <form method="POST" action=".">{%csrf_token%} 
    {{comment_form|crispy}} 
    <input type="hidden" value="{{ comment.id }}" name="parent_id"> 
    <input type="submit" value="Reply" class="btn btn-default" name=""> 
    </form> 
</div>

如果它不与FadeToggle一起使用您还会推荐什么来实现这种效果？我在这里或谷歌找不到任何东西。我发现的唯一的东西就像“在FadeToogles中显示的那样”或“当另一个人隐藏时显示一个”等等。所以如果这个问题已经回答了，请给我发送链接。谢谢

来源

2017-04-26 hansTheFranz

您的按钮在哪里？ – Huelfe

如果两个按钮放在“show-subcom”类的顶部，那么它是与DOM元素选择的问题。

$(this).parent().next(".show-subcom").fadeToggle().delay(1000);

你需要欺骗上面一行，我的猜测是

$(this).parent().next().next(".show-subcom").fadeToggle().delay(1000);

我个人的观点去与不父/下一个，而不是加号，以母公司和该ID的那个目标，而选择元素例如：

$("#commentsection > .show-subcom").fadeToggle().delay(1000);

来源

2017-04-26 12:10:17

在一个网站上使用两个淡入淡出

回答

相关问题