三通饼干

Meu*_*les 10 javascript cookies jquery

我正在用3个按钮构建弹出窗口!每个按钮需要设置一个cookie,但具有不同的到期时间/日期.我正在使用jquery.cookie这个!

  • 1个按钮更像是一个会话cookie.因此,当单击此按钮时,弹出窗口需要消失并在我启动新的浏览器屏幕时再次显示.所以,当我在同一个浏览器窗口和同一个网站上打开一个页面时.

  • 1个按钮用于"不再显示弹出窗口",将cookie设置为7天

  • 在AJAX succes函数中设置了1个cookie,设置为365天

我无法正确设置不同的到期时间.因此,例如当我单击带有会话cookie的按钮时,当我在网站内打开新页面时,弹出窗口再次显示.

我看不出我做错了什么!我没有得到任何控制台错误,但cookie不会正确设置.

我有的是这个:

 $(document).ready(function(){


    var my_cookie = $.cookie('regNewsletter');

    if (!my_cookie) {
      setTimeout(function(){
        $('#newsletter').modal('show');
      }, 1000);
    }
    $(".close--btn").on("click", function () {
      $.cookie('regNewsletter', true, {
        path: '/',
        domain: ''
      });
    });
    $(".dismiss--btn").on("click", function () {
      $.cookie('regNewsletter', true, {
        path: '/',
        domain: '',
        expires: 7
      });
    });
    console.log(my_cookie);

 // code for removing cookie when session ends //
 window.onbeforeunload = function() {
    $.removeCookie('regNewsletter', { path: '/', domain: '' });
 };


 $("#newsletter .btn").click(function(e){
      e.preventDefault();

       $.ajax({
       ... 

        success: function(txt, status, xhr){
       // some code //

              $.cookie('regNewsletter', true, {
                path: '/',
                expires: 365
              });

        // etc etc //


  });
Run Code Online (Sandbox Code Playgroud)

Gav*_*iel 4

要设置会话 cookie,您不需要删除它onbeforeunload,而只需设置一个没有设置过期时间的 cookie。域名也不需要设置,默认就可以了,就是当前网页的域名。

现场演示

$(document).ready(function(){
    var my_cookie = $.cookie('regNewsletter');        
    if (my_cookie && my_cookie=="true") {
      alert("Cookie found");
    } else {
      setTimeout(function(){
        //$('#newsletter').modal('show');
        alert("Popup newsletter");
      }, 1000);
    }
    $(".close--btn").on("click", function () {
      // set a session cookie. It'll be automatically deleted
      // when the browser is closed
      $.cookie('regNewsletter', 'true', {
        path: '/'
      });
      alert("session cookie set");
    });
    $(".dismiss--btn").on("click", function () {
      $.cookie('regNewsletter', 'true', {
        path: '/',
        expires: 7
      });
      alert("cookie set for 7 days");
    });
    console.log(my_cookie);
    $("#newsletter .btn").click(function(e){
       e.preventDefault();
       $.ajax({
         url:"setcookie.html",
         success: function(txt, status, xhr){
           $.cookie('regNewsletter', 'true', {
             path: '/',
             expires: 365
           });
           alert("cookie set for 365 days");
         }
       });
     });
 });
Run Code Online (Sandbox Code Playgroud)

html:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="jquery.cookie.js"></script>
<button class="close--btn">close</button>
<button class="dismiss--btn">dismiss</button>
<span id="newsletter"><button class="btn">ajax</button></span>
Run Code Online (Sandbox Code Playgroud)