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，如何避免呢？

1 个答案: