Question

我正在使用jQuery Cookie和Fancybox来显示一些预告视频。

我在页面底部设置了一个自定义链接，它看起来像这样：

<a class="fancybox-cookie" href="http://www.youtube.com/embed/the_video_link?autoplay=1&rel=0"></a>

在我的jQuery中，我正在显示这样的视频：

    (function($){
    $(document).ready(function() {

        //Cookie
                $.cookie('video', 'some_value', { path: '/events' });

                $('.fancybox-cookie').fancybox({
                openEffect      : 'elastic',
                closeEffect     : 'elastic',
                padding         : 20,
                maxWidth        : 800,
                maxHeight       : 600,
                fitToView       : false,
                width           : '70%',
                height          : '70%',
                autoSize        : false,
                type            : 'iframe',         
                }).trigger('click');
        //$.removeCookie('video');   
    });
})(jQuery);

正如您从代码中看到的那样，我正在尝试使用Cookie调用视频，但仅限于特定页面，在本例中为/events页面。即使我这样做，视频也会显示在每一页上。

我的想法是每当用户进入网站并访问“活动”页面时，Fancybox将显示视频，但如果访问者检查其他页面，则不应显示视频。

我在哪里弄错了？

这是我尝试过的另一种方法，它只显示一次，我设置的时间为2400分钟，在此之前我设置了一分钟就可以了，但它仍会显示在每一页上。

(function($){
$(document).ready(function() {
    if ($(window).width() > 768) {

    //Cookie
    var check_cookie = $.cookie('video');
    var date = new Date();
    var minutes = 2400;
    date.setTime(date.getTime() + (minutes * 60 * 1000));
    if(check_cookie == null) {
        $.cookie('video', 'some_value', { expires: date, path: '/events' });

        $('.fancybox-cookie').fancybox({
        'openEffect':    'elastic',
        'closeEffect':   'elastic',
        'padding'           : 20,
        'autoScale'         : false,
        'width'             : 800,
        'height'            : 705,
        'type'              : 'iframe', 
        'scrolling'         : 'no'      
        }).trigger('click');            
     }
     else {
        return false;   
    } 

    //$.removeCookie('video'); 
    }
});

})(jQuery);

编辑：我后来才意识到，在我的第一个例子中，我的错误是.trigger（）我正在调用每一页，所以它必须有一些逻辑，就像我的第二个例子中的 if statemen t ，但是为什么视频会在每个页面上触发？

Answer 1

根据Rob M在此thread中的回答，以及我之前对jQuery Cookie插件的使用回忆，path参数定义了cookie可用且可访问的URL从

另外，根据gitHub上的jQuery Cookie documentation：

删除Cookie时，您需要使用其中的设置你已经通过了创建它;
当您测试是否设置了Cookie时，您需要检查它是undefined，而不是null，如下所示：

var isCookieSet = typeof $.cookie('video') === 'undefined';

话虽这么说，我不明白为什么你甚至需要求助于jQuery Cookie，因为你只能在Events页面中显示链接（并触发它），如下所示：

jQuery(function($) {
    $(document).ready(function() {
        if( window.location.href.search(/\/events/) > -1 ) $(".fancybox-cookie").trigger("click");
    });
});

如果您使用jQuery Cookie的原因是因为您只想触发一次视频并且能够检测它是否已经被触发，那么这将是有意义的，您可以这样做：< / p>

jQuery(function($) {
    $(document).ready(function() {
        if( window.location.href.search(/\/events/) > -1 ) {
            if( typeof $.cookie('video') === 'undefined' ) {
                var date = new Date();
                var minutes = 2400;
                date.setTime(date.getTime() + (minutes * 60 * 1000));
                $.cookie('video', 'some_value', { expires: date });
                $(".fancybox-cookie").trigger("click");
            }
        }
    });
});

无需设置路径变量，因为根据文档，默认路径值是创建cookie的网址。

Jquery cookie仅在特定页面上显示

1 个答案: