获取cookie值后,jquery hover不起作用

获取cookie值后,jquery hover不起作用,jquery,function,cookies,hover,carousel,Jquery,Function,Cookies,Hover,Carousel,我有一个项目列表,带有用于列表视图、图库和网格的视图切换器 <div class="theView"> <div class="galS active" id="gal"><span><img src="layout/cyt/img/blank.gif"></span>Galerie</div> <div class="mosS" id="mos"><span><img src=

我有一个项目列表,带有用于列表视图、图库和网格的视图切换器

<div class="theView">
    <div class="galS active" id="gal"><span><img src="layout/cyt/img/blank.gif"></span>Galerie</div>
    <div class="mosS" id="mos"><span><img src="layout/cyt/img/blank.gif"></span>Mosaik</div>
    <div class="listS" id="list"><span><img src="layout/cyt/img/blank.gif"></span>Liste</div>
</div>


    <div id="itemcontainer">
        <div class="con">
        <div class="item_page_item list"> //list,mos,gal
            <div class="item sale"><span class="number">1</span>
                <div class="pos">
                    <div class="inner">
                    <div class="itemImg Img123"></div>
                    ...
                    </div>
               </div>
           </div>
        </div>
    </div>
当首先打开列表视图并更改为网格或图库时,带有集成旋转木马的悬停窗格不会打开,在所有其他情况下,一切正常

以下是悬停函数的代码:

    $(".item_page_item.mos").hover(function(){
          $(this).find(".pane").stop(true, true).fadeIn();
          $("#paneImg",this).carouFredSel({
                responsive: true,
                circular: false,
                auto: false,
                items: {
                    visible: 1,
                    width: 299,
                    height: 241
                },
                scroll: {
                    fx: 'directscroll'
                }
            });

            $("#paneThumb",this).carouFredSel({
                responsive: true,
                circular: false,
                infinite: false,
                auto: false,
                prev: '#prev',
                next: '#next',
                items: {
                    visible: {
                        min: 2,
                        max: 5
                    },
                    width: 51,
                    height: 42
                }
            });
            $('#paneThumb a',this).click(function() {
                $('#paneImg').trigger('slideTo', '#' + this.href.split('#').pop() );
                $('#paneThumb a').removeClass('selected');
                $(this).addClass('selected');
                return false;
            });
        },function(){
          $(this).find(".pane").stop(true, true).fadeOut(200, function() {
            $("#paneImg",this).trigger("destroy", true);
          });
        });
悬停时,覆盖层会在带有旋转木马(caroFredsel)的项目上淡出

唯一的问题是,当我将列表视图保存在cookie中,用此视图打开页面并更改为其他视图时,它不起作用

希望你能帮我,我快疯了

用于读取cookie值的函数:

$(function() {  
        var cc = $.cookie("theView");
        if (cc == "g") {
            $(".item_page_item").removeClass("list");
            $(".item_page_item").removeClass("mos");
            $(".item_page_item").addClass("gal");
            $("#gal").addClass("active");
            $("#list").removeClass("active");
            $("#mos").removeClass("active");

        } else if (cc == "m") {
            $(".item_page_item").removeClass("gal");
            $(".item_page_item").removeClass("list");
            $(".item_page_item").addClass("mos");
            $("#mos").addClass("active");
            $("#gal").removeClass("active");
            $("#list").removeClass("active");
        } else if (cc == "l") {
            $(".item_page_item").removeClass("gal");
            $(".item_page_item").removeClass("mos");
            $(".item_page_item").addClass("list");
            $("#list").addClass("active");
            $("#gal").removeClass("active");
            $("#mos").removeClass("active");
        }       
     });

您可以使用委托测试这段代码,也许您的问题来自这里:{替换您的悬停处理程序}

$(document).on('mouseenter mouseout', '.item_page_item.mos', function (e) {
    if (e.type === 'mouseenter') {
        $(this).find(".pane").stop(true, true).fadeIn();
        $("#paneImg", this).carouFredSel({
            responsive: true,
            circular: false,
            auto: false,
            items: {
                visible: 1,
                width: 299,
                height: 241
            },
            scroll: {
                fx: 'directscroll'
            }
        });

        $("#paneThumb", this).carouFredSel({
            responsive: true,
            circular: false,
            infinite: false,
            auto: false,
            prev: '#prev',
            next: '#next',
            items: {
                visible: {
                    min: 2,
                    max: 5
                },
                width: 51,
                height: 42
            }
        });
        $('#paneThumb a', this).click(function () {
            $('#paneImg').trigger('slideTo', '#' + this.href.split('#').pop());
            $('#paneThumb a').removeClass('selected');
            $(this).addClass('selected');
            return false;
        });
    } else {
        $(this).find(".pane").stop(true, true).fadeOut(200, function () {
            $("#paneImg", this).trigger("destroy", true);
        });
    }
});

从cookie加载时是否触发了悬停事件?我添加了读取cookie的功能,希望对您有所帮助。我在代码中没有看到任何“.item\u page\u item.mos”元素添加了一些html代码。这是我删除和添加不同项目视图的类列表、mos或gal的部分。我已经尝试过这样做。似乎工作,但悬停窗格只是闪烁很短。
$(document).on('mouseenter mouseout', '.item_page_item.mos', function (e) {
    if (e.type === 'mouseenter') {
        $(this).find(".pane").stop(true, true).fadeIn();
        $("#paneImg", this).carouFredSel({
            responsive: true,
            circular: false,
            auto: false,
            items: {
                visible: 1,
                width: 299,
                height: 241
            },
            scroll: {
                fx: 'directscroll'
            }
        });

        $("#paneThumb", this).carouFredSel({
            responsive: true,
            circular: false,
            infinite: false,
            auto: false,
            prev: '#prev',
            next: '#next',
            items: {
                visible: {
                    min: 2,
                    max: 5
                },
                width: 51,
                height: 42
            }
        });
        $('#paneThumb a', this).click(function () {
            $('#paneImg').trigger('slideTo', '#' + this.href.split('#').pop());
            $('#paneThumb a').removeClass('selected');
            $(this).addClass('selected');
            return false;
        });
    } else {
        $(this).find(".pane").stop(true, true).fadeOut(200, function () {
            $("#paneImg", this).trigger("destroy", true);
        });
    }
});