1

我已经编写了这段代码，以便在.box-open单击按钮.sharebox（#share-but时间，因为每次我单击一个按钮时，所有的.shareboxs 都会将类.box-open应用于它。

function shareBox() {
$('.share').each(function( index ) {
    $(this).on('click', '#share-but', function() {
        if ($('.sharebox').hasClass('box-open')) {
            $('.sharebox').removeClass('box-open');
        }        
        else {
            $('.sharebox').addClass('box-open');
        }
    });
});
}
shareBox();

这是问题的图像（我正在构建一个 Tumblr 主题）。希望它更容易理解。http://24.media.tumblr.com/c5c4252607bf4a9905c7c9de5b592c60/tumblr_ml4t2fSuQo1rqce8co1_500.png <---- 当我点击其中一个按钮时发生这种情况，但我只希望在我点击里面的时候添加一个.sharebox类相同的分区。.box-open#share-but.share

我希望这一切都是有道理的。我在 Javascript/Jquery 上仍然很菜鸟，因为我 2 周前才开始学习，所以非常感谢任何帮助！

4

2 回答 2

1

您必须使用$(this)而不是$('.sharebox')解决事件源

$('.sharebox').addClass('box-open');

将会

$(this).addClass('box-open');

元素的 id 在文档中应该是唯一的，因此您可以将 click 直接绑定到 '#share-but'，如果它不是唯一的，您可以像这样绑定它。

$('.share').on('click', '#share-but', function() {
    if ($('.sharebox').hasClass('box-open')) {
        $('.sharebox').removeClass('box-open');
    }        
    else {
        $('.sharebox').addClass('box-open');
    }
});

你可以用toggleClass它来简化，我假设你有一个 ID 为 #share 的项目，但是，

$('#share-but').click(function(){
   $(this).toggleClass("box-open");
});
于 2013-04-12T07:45:31.800 回答
0

这将是一个更简单的版本，您可以切换类名:)

   $('.share').on("click", "#share-but", function() {
      $(this).find(".sharebox").toggleClass('box-open');
  });
于 2013-04-12T07:49:09.337 回答