单击时仅显示一个 tumblr 帖子的标签jquery

问题描述

所以我使用 jQuery 来制作这些在 Tumblr 上点击时显示的滑动标签,但我的问题是我不知道如何使用脚本,所以只点击该点击帖子的标签显示。我使用的是图标字体,每个帖子上都有一个,但是当您点击它时,每个帖子的所有标签都会显示

.tags {display: none;}
<div class="post-controls">
        <a class="slide-tags"><span class="th th-bookmark-1"></span></a>
        <a href="{ReblogURL}" target="_blank"><span class="th th-reblog"></span></a>
        <a class="likeb" href="#">{LikeButton}<span class="actual-button"><span class="th th-heart-1-o"></span></span></a>

(所以在书签图标上方是点击以显示标签内容) 下面是脚本本身。

<script>
    $(document).ready(function() {
        $(".slide-tags").click(function() {
            $(".tags").slidetoggle();
        });
    });
</script>

您可以转到帐户 here 并实际自己点击它,看看我的意思(只需点击喜欢和转发按钮旁边的小书签)。

解决方法

您需要设置对当前 $(this) 选择器的调用,而其余选择器将使用 slideUp() 方法从显示中移除。

$(document).ready(function () {
    $(".slide-tags").click(function () {
        $(".tags").slideUp();
        $(this).closest(".posts").find(".tags").slideToggle();
    });
});