Javascript 创建Cookie,记住页面是否应加载响应设计的移动或桌面布局

Javascript 创建Cookie,记住页面是否应加载响应设计的移动或桌面布局,javascript,mobile,cookies,responsive-design,Javascript,Mobile,Cookies,Responsive Design,我已经创建了一个响应性设计,允许用户在移动和桌面布局之间切换。我唯一的问题是,如果用户希望查看桌面版本,然后单击另一个链接或刷新页面,则会再次加载移动版本。我想创建一个cookie,以便它记住用户在每次页面加载时的偏好 下面是我正在使用的javascript: $(document).ready(function () { $('.full_site').click(function() { $('body').removeClass('mobile');

我已经创建了一个响应性设计,允许用户在移动和桌面布局之间切换。我唯一的问题是,如果用户希望查看桌面版本,然后单击另一个链接或刷新页面,则会再次加载移动版本。我想创建一个cookie,以便它记住用户在每次页面加载时的偏好

下面是我正在使用的javascript:

$(document).ready(function () {
    $('.full_site').click(function() {
        $('body').removeClass('mobile');
        $('body').addClass('desktop');
        $('.views-row').each(function(i,e) {
            $('.content .body', e).insertAfter($('.content .loc-text', e));
        });
    });

    $('.mobile_site').click(function() {
        $('body').removeClass('desktop');
        $('body').addClass('mobile');
        $('.views-row').each(function(i,e) {
          $('.content .body', e).insertBefore($('.content .field-name-field-image-one', e));
        });

        $('.views-row').each(function(i,e) {
          $('.content .body', e).insertBefore($('.content .field-name-field-image', e));
        });
    });
}); 

以下是一份草稿,其中包含了帮助您完成流程的注释:

$(document).ready(function () {
    $('.full_site').click(function() {
        document.cookie = "type=full"; //set/update the cookie
        $('body').removeClass('mobile');
        $('body').addClass('desktop');
        $('.views-row').each(function(i,e) {
            $('.content .body', e).insertAfter($('.content .loc-text', e));
        });
    });

    $('.mobile_site').click(function() {
        document.cookie = "type=mobile"; //set/update cookie
        $('body').removeClass('desktop');
        $('body').addClass('mobile');
        $('.views-row').each(function(i,e) {
          $('.content .body', e).insertBefore($('.content .field-name-field-image-one', e));
        });

        $('.views-row').each(function(i,e) {
          $('.content .body', e).insertBefore($('.content .field-name-field-image', e));
        });
    });
   if(/*check to see what the cookie is...*/) 
     $(".mobile_site").trigger("click"); //trigger the mobile site
   else
     $(".full_site").trigger("click"); //trigger the full site
}); 
有关Cookie的更多信息:


和:

那么你有什么问题?你试过JQuery cookie插件吗?嗨,迈克。我以前没有尝试过这个插件,但它看起来会奏效。问题是,我以前从未与cookeis合作过。谢谢!我真的很感谢你的帮助!工作得很好。我需要对饼干做更多的研究。很高兴我能帮上忙。您可能对此处提到的3个函数感兴趣:
getCookie
setCookie
eraseCookie
。“重新发明轮子”毫无意义,它可能会帮你一点忙。嘿,蔡斯。我现在有个奇怪的问题。当我有if(document.cookie.type==“mobile”)或if(document.cookie.type==“full”,该页面将自动加载完整版本。如果我单击“移动”,它将加载移动版本,但如果我重新加载该页面或转到新页面,它将恢复为完整版本。有什么想法吗?提前感谢!我表示歉意。我昨天删除了该行,因为您无法以这种方式访问该类型。在我之前的评论中,我提到了3功能s这对获取、设置和清除cookie应该有一些帮助。请查看它们并将它们包含在代码中。如果您仍然需要任何帮助,请告诉我。再说一遍,这是我的错误,您不能使用
document.cookie.type
,因为
document.cookie
是字符串而不是对象。