滑动事件出现时，图像更改取决于caurosel项目

Question

我正在尝试在caurosel幻灯片事件触发时更改backgorund图像 我无法在互联网上提交任何解决方案 请给我一个很好的JS代码

JS FLIE

$('#myCarousel').on('slide.bs.carousel', function() {
             if ($('.item').hasClass('one')) {
                alert("1");
             }else if($('.item').hasClass('second')){
                alert("2");
             }else if($('.item').hasClass('third')){
                alert("3");
             }else if($('.item').hasClass('fourth')){
                alert("4");
             }
        });

HTML文件：

<div class="carousel-inner" role="listbox">

                  <div class="item active one">
                    <div class="carousel-caption">
                      <a class="animated-slow fadeInUp link link--nukun" href="#">Identity ca<span class="rotate">r</span>d</a>
                    </div>
                  </div>

                  <div class="item two">
                    <div class="carousel-caption">
                      <a class="animated-slow fadeInUp link link--nukun" href="#">Electronic Signatu<span class="rotate">r</span>e pad</a>
                    </div>
                  </div>

                  <div class="item three">
                    <div class="carousel-caption">
                      <a class="animated-slow fadeInUp link link--nukun" href="#">Finger p<span class="rotate">r</span>int Scanner</a>
                    </div>
                  </div>

                  <div class="item four">
                    <div class="carousel-caption">
                      <a class="animated-slow fadeInUp link link--nukun" href="#">Metal K<span class="rotate">e</span>y pads</a>
                    </div>
                  </div>
                </div>