如果用户按下closeBtn,则设置cookie

时间:2017-07-14 09:55:40

标签: javascript cookies

如果usser通过closeBtn关闭了弹出窗口,请不要再显示它直到明天。 并且如果它能够在2个访问过的页面之后显示弹出窗口。开始的setTimeout没问题。

jQuery(function ($) {
    var check_cookie = $.cookie('newsletter_popup');
    if (check_cookie == null || check_cookie == 'shown') {
        setTimeout("beginNewsletterForm()", 120000);
    }

    $('#newsletter_popup_dont_show_again').on('change', function () {
        if ($(this).length) {
            var check_cookie = $.cookie('newsletter_popup');
            if (check_cookie == null || check_cookie == 'shown') {
                $.cookie('newsletter_popup', 'dontshowitagain');
            }
            else {
                $.cookie('newsletter_popup', 'shown');
                setTimeout("beginNewsletterForm()", 120000);
            }
        } else {
            $.cookie('newsletter_popup', 'shown');
        }
    });
});

function beginNewsletterForm() {
    jQuery.fancybox({
        'padding': '0px',
        'autoScale': true,
        'transitionIn': 'fade',
        'transitionOut': 'fade',
        'type': 'inline',
        'href': '#newsletter_popup',
        'onComplete': function () {
            $.cookie('newsletter_popup', 'shown');
        },
        'tpl': {
            closeBtn: '<a title="Close" class="fancybox-item fancybox-close fancybox-newsletter-close" href="javascript:;"></a>'
        }
    });
    jQuery('#newsletter_popup').trigger('click');
}

1 个答案:

答案 0 :(得分:0)

你可以在JAVASCRIPT中创建一个函数来检查你是否已经显示了你的弹出消息以及getCookie函数和setCookie

//execute this function when your document loads
popupChecker();

function popupChecker()
{
   if(getCookie("popup") != "true")
   {
        //show pop up
   }
}

//chage closeBtnId with your close btn ID

$("closeBtnId").click()
{
    //set cookie that expires in 1 day
    setCookie("popup", "true", 1);
}

这是获取和设置cookie的功能,将其粘贴到您的.JS文件或只是为干净的代码创建新的CLASS。

function setCookie(cname, cvalue, exdays) 
{
   var d = new Date();
   d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
   var expires = "expires="+d.toUTCString();
   document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}


function getCookie(cname) 
{
   var name = cname + "=";
   var decodedCookie = decodeURIComponent(document.cookie);
   var ca = decodedCookie.split(';');
   for(var i = 0; i <ca.length; i++) 
   {
     var c = ca[i];
     while (c.charAt(0) == ' ') 
     {
        c = c.substring(1);
     }
     if (c.indexOf(name) == 0) 
     {
        return c.substring(name.length, c.length);
     }
   }
return "";
}

你是什么意思“如果它能够在2个访问过的页面之后显示弹出窗口”?根据我的理解,你想检查用户是否已经在你的页面中访问了两次?如果是的话?你想要显示弹出消息。所以我只修改了closeBtn的popChecker和click事件。

function popupChecker()
{
   if(getCookie("popup") == "true")
   {
      //check if visit count is equals to 2 
     if(getCookie("visit_count") == "2")
     {
        //show pop up
     }

   }else
   {
       //show pop up and add 1 to visit_count cookie
       var visitCount = getCookie("visit_count");
       setCookie("visit_count", visitCount + 1, 1);
   }
 }

//chage closeBtnId with your close btn ID

$("closeBtnId").click()
{
   setCookie("popup", "true", 1);
   setCookie("visit_count", "1", 1);
}

为了更好地理解使用JS的Cookies,您可以访问此站点 https://www.w3schools.com/js/js_cookies.asp