我有以下内容。我正在尝试根据 css 类的更改触发该函数,但它不起作用。

<script type="text/javascript">

jQuery(document).ready(function(){

jQuery("#slider-banner").bind("cssClassChanged",function(){
    console.log("I'm Here!");
    if(jQuery("#slider-banner").hasClass('living-nutrients'))
    {
        jQuery("#home-middle-first").css("background-image","url([image path])");
    }
    else if(jQuery("#slider-banner").hasClass('right-partner'))
    {
        jQuery("#home-middle-second").css("background-image","url([image path])");
    }
    else if(jQuery("#slider-banner").hasClass('with-you'))
    {
        jQuery("#home-middle-third").css("background-image","url([image path])");
    }
});

    jQuery("#slider-banner").trigger('cssClassChanged');

colsole 在页面加载时显示我的 console.log 消息,但在页面加载后类再次更改时不会显示。有人看到我做错了什么吗?

更新:

所以我了解到“cssClassChanged”不合法......我试图调整我在其他地方找到的答案......我确实意识到如果jQuery是一种武器,我会很危险! (知道这是成功的一半,对吧?)

我尝试改编 gdoron 的 answer 链接到以下内容:
<script type="text/javascript">

jQuery(document).ready(function()
{
    function checkForChanges()
    {
        if(jQuery("#slider-banner").hasClass('living-nutrients'))
        {
            jQuery("#home-middle-first").css("background-image","url([image path])");
        }
        else if(jQuery("#slider-banner").hasClass('right-partner'))
        {
            jQuery("#home-middle-second").css("background-image","url([image path])");
        }
        else if(jQuery("#slider-banner").hasClass('with-you'))
        {
            jQuery("#home-middle-third").css("background-image","url([image path])");
        }

        else
            setTimeout(checkForChanges, 500);
    }
});
</script>

不过,我仍然缺少一些东西。它仅适用于页面加载的第一类。

有人问我是怎么换类的。我正在使用滑块,并且在每张幻灯片上都有一个 ID 为“滑块横幅”的 div,并且类根据我尝试为其切换背景图像的三个 ID 区域中的哪一个而有所不同。

最佳答案

我认为没有这样的事件 cssClassChanged 可以解释所有...

10 小时前我回答了如何检测类(class)变化,阅读我的回答 there

更新:

function checkForChanges()
{
    var sliderBanner = jQuery("#slider-banner");
    if(sliderBanner.hasClass('living-nutrients'))
    {
        jQuery("#home-middle-first").css("background-image","url([image path])");
    }
    else if(sliderBanner.hasClass('right-partner'))
    {
        jQuery("#home-middle-second").css("background-image","url([image path])");
    }
    else if(sliderBanner.hasClass('with-you'))
    {
        jQuery("#home-middle-third").css("background-image","url([image path])");
    }

    setTimeout(checkForChanges, 500);
}

jQuery(checkForChanges);

关于javascript - 基于类变化的触发功能,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/9608981/

10-13 09:52