简体   繁体   中英

How to create cookie in jQuery modal?

I try to create a page with jquery modal and cookie. The modal work well but I have a problem to set cookie in it. I'd like to achieve the following:

  • On homepage load, display modal box (popup)
  • Popup close when close button is clicked and when user return the page, the modal box will not show.
  • Popup will show again after 7 days.

Please advice!

        // Close modal when click on close button 
    $close.click(function(e){
    e.preventDefault();
    method.close();
    });

       return method;
    }());


        // querying the document
        $(document).ready(function(){

        if (document.cookie.indexOf('$close.click=true') == -1){
            var sevenDays = 1000*60*60*24*7;
            var expires = new Date((new Date()).valueOf() + sevenDays);
            document.cookie = "$close.click=true;expires=" +  expires.toUTCString();
            };

            // Append data via Ajax
            $.get('url', function(data){
                modal.open({content: data});
            });

        });

when i should work with cookie i use this plugin https://github.com/carhartl/jquery-cookie

You can use following structure of model

var modal = (function(){
        var 
        method = {},
        $overlay,
        $modal,
        $content,
        $close;

        // Center the modal in the viewport
        method.setPosition = function () {
            // Set Postion
        };

        // Open the modal, reveal overlay 
        method.open = function (settings) {
            if($.cookie('NameOfCookie'))
            {
                // We dont need show popup
                return
            }else{
                // Open Modal               
                $.cookie('NameOfCookie', 'created', { expires: 7 });
                method.GenerateModalPopup();
                method.setPosition()
            }
        };

        // Close the modal and overlay, then unbind the resize event when modal is closed
        method.close = function () { 
            // Close Modal
        };

        method.GenerateModalPopup=function(){
            // Generate the HTML and add it to the document

        };

        // Open popup window
        method.open();

   return method;
}());

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM