Question

这就是我现在所拥有的：

    $('.slick-slide div').click(function() {
    var thisClass = $(this).attr('class');

    if ($('.experts-copy-block div').hasClass(thisClass)) {
        $('.experts-copy-block div').addClass('active').siblings().removeClass('active');
    }

});

这是HTML：

<div class="slick-slide">
    <div class="alpha"></div>
    <div class="beta"></div>
    <div class="gamma"></div>
    <div class="delta"></div>
</div>
<div class="experts-copy-block">
    <div class="alpha"></div>
    <div class="beta"></div>
    <div class="gamma"></div>
    <div class="delta"></div>
</div>

所以我想要的是如果单击.slick-slide .beta，那么.experts-copy-block .beta会使类处于活动状态，如果任何其他兄弟已经激活了类，则将其删除。

Answer 1

$('.slick-slide div').click(function() {
    var thisClass = $(this).attr('class');

    $('.experts-copy-block div.' + thisClass).addClass('active').siblings().removeClass('active');
});

Answer 2

您可以使用以下内容：

$(".slick-slide div").click(function () {
  // Remove all the active classes.
  $(".experts-copy-block div").removeClass("active");
  // Add an active class to the clicked element.
  $(".experts-copy-block").find($(this).attr("class")).addClass("active");
});

这有用吗？

Answer 3

$('.slick-slide div').click(function() {
   var thisClass = $(this).attr('class');

  $('.experts-copy-block div.active').removeClass('active');
  $('.experts-copy-block div.' + thisClass).addClass('active');

});

我建议移动＆＃39;班级＆＃39;但是，数据属性。虽然代码需要改变一下。

当单击带有类x的div时，将类激活添加到具有类x

3 个答案: