Jquery 在新图像加载时触发函数，该函数将选择器与If/else语句相匹配

我遇到了麻烦，需要一些指导才能让这一切顺利进行。我以我是jQuery的noob作为开场白，任何我可以写得更好或更精简的方法都是受欢迎的

目前我在页面上有两个滑块。每个图像都有一个唯一的类。当用户单击图像滑块时，图像将滑入，并将类“activeSlide”添加到其中。我希望发生的是，当用户单击滑块并加载与另一个图像匹配的图像时，会弹出一个警报。将有不同的图像组合触发弹出窗口，如果没有匹配，则不会发生任何事情

目前，使用下面的代码，它可以工作，不过在图像匹配后，用户再次单击滑块时会触发警报。理想情况是用户单击图像滑块，加载新图像，如果匹配，则调用事件处理程序弹出警报

这是我的HTML：

<div id="top" class="Slider">
    <img class="rsImg" src="images/tShirtRed.png" alt="tShirtRed" />
    <img class="rsImg" src="images/tShirtGreen.png" alt="tShirtGreen" />
    <img class="rsImg" src="images/tShirtRed.png" alt="tShirtRed" />
</div>


<div id="bottom" class="Slider">
    <img class="classBottom1" src="images/image5.png" alt="" />
    <img class="classBottom2" src="images/image6.png" alt="" />
    <img class="classBottom3" src="images/image6.png" alt="" />
</div>

我的开发环境在这里：

提前感谢您，并感谢您的任何意见。干杯

---

-Chris在RoyalSlider开发人员的帮助下解决了这个问题：

jQuery需要在滑块初始化之后并在document.ready（）函数中

我还需要重新安排我试图调用的函数。请参见上面的固定代码

再次感谢RoyalSlider的Dmitry！

---

-Chris

关于你的代码，一个img怎么能同时是.classTop1和.classBottom1？有两个不同的滑块，具有不同的图像/类。我知道，但这是两个独立的幻灯片，但是img不能同时出现在两个位置。在显示警报后，是否要从图像中删除

activeClass

？或者问题是，如果第二次单击成功匹配的对中的任何一个，则会显示警报-如果是这样，您应该向它们添加一个CLA，如

successfulMatch

，然后在显示警报之前检查是否存在该CLA。@deerchao我认为他的代码将

activeClass

添加到“正确”中每个

滑块中的图像

元素，因此

$（'.activeClass'）

将匹配这两个元素，并且如果其中一个元素与选择器匹配，

.is（）

将成功@Centinel3提供一个可以正常工作的jsfiddle.net演示来演示这个问题将非常非常有帮助。

var sliderInstance = $("#chest").data('royalSlider');

    sliderInstance.ev.on('rsAfterSlideChange', function() {
            if (($('#chest .rsActiveSlide img').attr('alt') == 'tShirtGreen') && ($('#legs .rsActiveSlide img').attr('alt') == 'jeansGreen')) {
            alert('Your message');
            } else {
            //Do nothing
            }
    });