jquery - 如何通过jquery改变父类的背景颜色

Question

您好，我正在尝试使用 .carousel-indicators 定位 relative 来制作 Bootstrap 轮播。 但是，正因为如此，我无法将每个轮播元素的 background-color 设置为不同的
因为它不能应用于指示器所在的上部。
所以我尝试将 background-color 属性应用于父类。

这是我的 HTML 代码:

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel" data-interval="false">

  <!-- Wrapper for slides -->
   <div class="carousel-inner" role="listbox">

      <!-- Indicators -->
      <ol class="carousel-indicators text-left">
        <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
        <li data-target="#carousel-example-generic" data-slide-to="1"></li>
        <li data-target="#carousel-example-generic" data-slide-to="2"></li>
        <li data-target="#carousel-example-generic" data-slide-to="3"></li>
      </ol>

      <div id="item0" class="item active">
      </div>
      <div id="item1" class="item">
      </div>
      <div id="item2" class="item">
      </div>
      <div id="item3" class="item">
      </div>
  </div>
</div>

下面是我试过的 jQuery 代码，
但它不起作用，我想知道为什么。

$(document).ready(function () {
    if ($("#item2").hasClass('active')) {
        $(".carousel-inner").css('background-color, '#d4ddde');
    }
    else {
        $(".carousel-inner").css('background-color, 'none');
    }
});

我编辑了 jQuery 语法，但仍然不起作用。

Answer 1

jquery hasClass和 css有问题的用法不正确。使用以下内容:

$(document).ready(function () {
    if ($("#item2").hasClass('active')) {
        $(".carousel-inner").css('background-color','#d4ddde');
    }
    else {
        $(".carousel-inner").css('background-color','transparent');
    }
});