javascript - 为弹出 div 设置 cookie

标签 javascript jquery css cookies

你好,先生/ friend ,我想为弹出式 div 设置 cookie,我不是专业的 java 或 jquery 编码器,但我对此知之甚少..所以请帮助为弹出式 div 设置 cookie,如果你请告诉我如何设置它的日期.. 在此先感谢.. 下面是我正在使用的代码..

<style>
#exepopup {
    background-color: white;
    position:fixed;
    z-index: 999999;
    display: none;
    padding: 0;
    border: 10px solid #446c95;
    -webkit-background-clip: padding-box;
    /* for Safari */
    background-clip: padding-box;
    /* for IE9+, Firefox 4+, Opera, Chrome */
    -webkit-border-radius: 8px 8px 8px 8px;
    -moz-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    width: 420px;
    height: 300;
    overflow: auto;
    left:50% !important;
    margin-left:-220px;
    margin-top:10%;
    box-shadow: inset 0 1px rgba(0, 0, 0, 0.1);
}
#exepopup span {
    font-size: 12px !important;
    font-weight: normal !important;
}
#exepopup h1 {
    background: #446c95 url(http://4.bp.blogspot.com/-wbOyGFuANTQ/UVF1F4ouC4I/AAAAAAAABiA/RX4jNlICbjM/s1600/aktechz-fb-lock.png) 98% 30% no-repeat;
    border: 0px solid #3b5998 !important;
    color: #FFF !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    padding: 5px !important;
    margin: 0 0 10px 0 !important;
    font-family: arial !important;
    overflow: hidden !important;
}
.exepopupdata {
    font-size: 12px !important;
    font-weight: normal !important;
    height: 275px !important;
    padding: 1px !important;
    background: #fff !important;
    border-bottom: 0px solid #ddd;
    overflow: show !important;
}
#exepopupfooter {
    text-align: right;
    font-size:12px;
    background: #F2F2F2 !important;
    height: auto !important;
    padding: 10px !important;
    overflow: hidden !important;
}
#exepopupfooter p {
    text-align: right;
    font-size:12px;
}
#exepopupclose {
    float: right;
    background-color: #446c95 !important;
    border: 0px solid #ccc !important;
    color: #fff !important;
    font-weight: normal !important;
    padding: 5px 35px !important;
    text-decoration: none !important;
    display: inline-block !important;
    font-family: arial !important;
    outline: none !important;
    font-size: 12px !important;
    margin: 0px !important;
    box-shadow: inset 0 1px rgba(0, 0, 0, 0.1);
    -webkit-transition: background 0.3s;
    -moz-transition: background 0.3s;
    transition: background 0.3s;
}  
</style>

<script type='text/javascript'>
    jQuery(document).ready(function() {
        function exepopupfunc() {
            var sec = 60
            var timer = setInterval(function() {
                $( & quot;#exepopupfooter span & quot;).text(sec--);
                if (sec == 0) {
                    $( & quot;#exepopup & quot;).fadeOut( & quot; slow & quot;);
                    clearInterval(timer);
                }
            }, 1000);
            var exepopupwindow = jQuery(window).height();
            var exepopupdiv = jQuery( & quot;#exepopup & quot;).height();
            var exepopuptop = jQuery(window).scrollTop() + 50;
            jQuery( & quot;#exepopup & quot;).css({ & quot;
                top & quot;: exepopuptop
            });
        }
        jQuery(window).fadeIn(exepopupfunc).resize(exepopupfunc)
        //alert(jQuery.cookie(&#39;sreqshown&#39;));
        //var exepopupww = jQuery(window).width();
        //var exepopupwww = jQuery(&quot;#exepopup&quot;).width();
        //var exepopupleft = (exepopupww-exepopupwww)/2;
        var exepopupleft = 500;
        //var exepopupwindow = jQuery(window).height();
        //var exepopupdiv = jQuery(&quot;#exepopup&quot;).height();
        //var exepopuptop = (jQuery(window).scrollTop()+exepopupwindow-exepopupdiv) / 2;
        jQuery( & quot;#exepopup & quot;).animate({
            opacity: & quot;
            1 & quot;, left: & quot;
            0 & quot;, left: exepopupleft
        }, 0).show();
        jQuery( & quot;#exepopupclose & quot;).click(function() {
            jQuery( & quot;#exepopup & quot;).animate({
                opacity: & quot;
                0 & quot;, left: & quot; - 5000000 & quot;
            }, 1000).show();
        });
    });

    //setting cookies for popup window

    $(document).ready(function() {

        // If the 'hide cookie is not set we show the message
        if (!readCookie('hide')) {
            $('#exepopup').show();
        }

        // Add the event that closes the popup and sets the cookie that tells us to
        // not show it again until one day has passed.
        $('#exepopupclose').click(function() {
            $('#exepopup').hide();
            createCookie('hide', true, 1)
            return false;
        });

    });

    // ---
    // And some generic cookie logic
    // ---
    function createCookie(name, value, days) {
        if (days) {
            var date = new Date();
            date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
            var expires = "; expires=" + date.toGMTString();
        } else var expires = "";
        document.cookie = name + "=" + value + expires + "; path=/";
    }

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

    function eraseCookie(name) {
        createCookie(name, "", -1);
    }
</script>

最佳答案

您正在创建一个接受 3 个参数的函数,name, value, days:

function createCookie(name, value, days) {

你在这里调用这个函数:

 createCookie('hide', true, 1)

这将创建一个名为 hide 的 cookie,其值为 true,将持续 1 天

1 更改为您想要的任何值,以确定 cookie 将持续多少天。

关于javascript - 为弹出 div 设置 cookie,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26911219/

相关文章:

javascript - 如何将购物车总额从 html/php 传递到 Stripe,其中购物车总额由 JS 计算

javascript - HTML5 每隔几秒保存一次 Canvas 图像

asp.net - 为什么我的 cookie 没有被删除/取消设置?

jquery - 滚动到重复元素

html - html 表格单元格中的新行 (\n)

javascript - 如何将文本框值从一页传递到另一页?

javascript - 在不刷新浏览器的情况下使用 replaceWith 同时单击按钮

javascript - 如何在文件上传时显示加载图形?

html - <div> 位置 :absolute; bottom: 0; not working as expected in IE7

CSS ID 与类