Question

我正在尝试将carhartl的jquery.cookie.js脚本添加到我的modal script，以便只有当用户没有在那里/看过3天的模态或者用户有最近在那里清理了缓存。

这是我到目前为止所拥有的......

此代码目前通过自动点击按钮启动模态窗口并完美运行来启动我的模态。 （我知道可能有一种方法可以重新设置它，这样它就可以自动加载模态而无需按钮，所以如果你可以帮我重新工作那部分我也会很感激。） 的

<div style="visibility:hidden;">
   <button class="md-trigger" id="modal11" data-modal="modal-11"></button>
</div>

<script>
jQuery(function(){
   jQuery('#modal11').click();
});
</script>

但是在添加脚本时添加一个cookie到我的模态，我似乎遇到了问题，请查看下面的代码，看看我哪里出错...

<div style="visibility:hidden;">
   <button class="md-trigger" id="modal11" data-modal="modal-11"></button>
</div>

<script>
   $(document).ready(function() {
      if ($.cookie('modal_shown') == null) {
         $.cookie('modal_shown', 'yes', { expires: 3, path: '/' });
         $('#modal11').click();
      }
   });
</script>

提前感谢您提供的任何帮助，我非常感谢您的帮助！ ; - ）

这是我的更新，基于@ zigdawgydawg的帮助...但它仍然无法正常运行...

<script>
$(document).ready(function() {
   $('#modal11').click(function();
});

console.log($.cookie('modal_shown'));
   if ($.cookie('modal_shown') == null) {
      console.log('creating cookie');
   $.cookie('modal_shown', 'yes', { expires: 365, path: '/' });
   $('#modal11').click();

}
console.log($.cookie('modal_shown'));
});
</script>

Answer 1

这是一个工作示例，如果“modal_shown”cookie不存在，则会显示一个对话框。显示模式后，会添加cookie，以便在3天内不再显示。

演示：http://jsfiddle.net/3M9Wq/

您需要包含这些库/样式表：jQuery，jQuery UI，jQuery Cookie插件，jQuery UI主题CSS。

HTML：

<div id="dialog">The dialog</div>

jQuery的：

$(document).ready(function() {

    // Initialize the dialog (initially hidden)
    $('#dialog').dialog({autoOpen: false});

    // Check for the "modal_shown" cookie.  If not found, show the dialog and add the cookie
    if ($.cookie('modal_shown') == null) {
        $.cookie('modal_shown', 'yes', { expires: 3, path: '/' });
        $('#dialog').dialog("open");        
    }
});

点击按钮而不是直接打开对话框的备用jQuery：

$(document).ready(function() {

    // Check for the "modal_shown" cookie.  If not found, click the button and add the cookie
    if ($.cookie('modal_shown') == null) {
        $.cookie('modal_shown', 'yes', { expires: 3, path: '/' });
        $('#modal11').click();     
    }
});

使用cookie每3天显示一次模态窗口

1 个答案: