点击切换打开所有的div，如何避免呢？

Question

我在文章中有一个用于社交分享的开关，但是当我点击它时，它会在所有文章中打开。

我试图在 css 中做一些事情，但我认为问题出在 jquery。

$(document).ready (function(){
$(".social-box").click(function(){
$(".a").toggleClass("active");
});
$(".social-box").click(function(){
$(this).toggleClass("activered");

我希望它只在所选文章中打开。

已编辑：

<div id="post"><div class="social-box"><h5><i class="fa fa-share-alt"></i></h5> 
         <div class="a"><a href="https://www.facebook.com/"><i class="fab fa-facebook-f"></i></a></div>
            <div class="a"><i class="fab fa-instagram"></i></div>
            <div class="a"><i class="fab fa-twitter"></i></div>
            <div class="a"><i class="fab fa-pinterest"></i></div>
        </div> <p></p></div>

Answer 1

如果我没有正确理解你的问题，那么你的目标是所有 class="a" 元素，而不是所选 .social-box 中包含的元素。您将只需要定位其中的那些元素。

$(document).ready (function(){
  $(".social-box").click(function(){
    $(this).find(".a").toggleClass("active");
    $(this).toggleClass("activered"); 
  });
});

点击切换打开所有的div，如何避免呢？

Click on toggle open all the divs, how to avoid it?

css

jquery

toggle