为 JQuery UI 模式对话框设置 Cookie答案

【问题标题】：Setting a Cookie For JQuery UI Modal Dialog为 JQuery UI 模式对话框设置 Cookie
【发布时间】：2011-08-19 12:28:17
【问题描述】：

在登录我们的网上银行产品以显示消息时，我们有一个 JQuery UI 模式对话框。每次都会弹出这个。现在我们想让这个基于 cookie 的用户只看到这个框一次，直到他们的 cookie 被清除。我怎样才能做到这一点？

<body onLoad="loadPage();" onUnload="unloadPage();">
<script>

$(function() {
    // a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
    //$( "#dialog:ui-dialog" ).dialog( "destroy" );


    $( "#dialog-modal" ).dialog({
        height: 475,
        width: 550,
        position: 'top',
        modal: true,
        buttons:{ "Close": function() { $(this).dialog("close"); } },
        draggable: false,
        resizable: false
    });

});


</script>

提款机/借记卡持有人的重要信息

联邦法规最近发生了变化，这意味着我们需要获得您的许可才能考虑为您的日常借记交易支付透支。

请单击此处了解有关透支费用和借记卡交易的重要信息。

【问题讨论】：

标签： jquery user-interface cookies modal-dialog

【解决方案1】：

最简单的方法是使用jQuery Cookie Plugin创建一个cookie来存储他们是否看过它：

//Set a cookie value
$.cookie('seen', 'yes');

//get the value
var seen = $.cookie('seen');
if(seen == null) { /*have not seen, show modal*/ }

//delete cookie
$.cookie('seen', null);

【讨论】：

【解决方案2】：

当点击关闭按钮时，cookie 将被存储 as(Cookie 名称 = subscribe_popup_status) 值（显示）

$.cookie("cookie_name", "cookie_value");

$( '.home_page_popup' ).dialog({ 
   autoOpen: false,
   closeText: "",
   modal: true,
   resizable: false,
   icon: "ui-icon-heart",
   classes: {
       "ui-dialog": "home_page_popup_dialog"
   },
   width: pop_up_width
});

$(".home_page_popup").on("click",".popup_close",function() {

    if ($.cookie('subscribe_popup_status') == null) {
       $.cookie('subscribe_popup_status', 'shown',{ expires: popup_duration });
    }

    $( '.home_page_popup' ).dialog('close');

});

【讨论】：

代码总是好的，但是关于它正在做什么的描述或一些cmets也很有帮助。
craigcaulfield - 在标题中解释