具有延迟的Bootstrap模式,仅使用cookie显示一次

时间:2015-04-07 23:01:42

标签: twitter-bootstrap cookies modal-dialog delay

我有一个允许模态延迟的代码。并且,如果用户单击YES(具有id =“closemodal”)或NO(具有data-dismiss =“modal”)链接,则模式将不再显示,直到用户离开页面,然后返回同一页面。

<script type="text/javascript">
$(document).ready(function() {  
        setTimeout(function(){
         $('#myModal').modal('show');
        }, 10000);
        $('#closemodal').click(function() {
        $('#myModal').modal('hide') });
});
</script>

但是,我想要的是,模式在向用户显示一次之后根本不显示备份。我找到了this post。我将它与我的代码结合起来,如下所示。

但是,我似乎无法让它发挥作用。任何帮助表示赞赏。

<script type="text/javascript">
$(document).ready(function() {  
    if($.cookie('msg') != null && $.cookie('msg') != "")
    {
        $("div#myModal.modal, .modal-backdrop").hide();
    }
    else
    {
        setTimeout(function(){
        $('#myModal').modal('show');
        }, 10000);
        $.cookie('msg', 1 ); //moved this up and changed 'str' to 1
        $('#closemodal').click(function() {
        $('#myModal').modal('hide'); });
    }
});
</script>

非常感谢任何帮助。

更新:以防这有助于任何人。这是我在this post的帮助下最终得到的结果。

<script type="text/javascript">
if($.cookie('prepare') != 'seen'){
    $.cookie('prepare', 'seen', { expires: 365, path: '/' }); // Set it to last a year, for example.
    setTimeout(function(){
         $('#myModal').modal('show');
        }, 1000);
    $('#closemodal').click(function() // You are clicking the close button
    {
        $('#myModal').modal('hide'); // Now the pop up is hiden.
    });
    $('#myModal').click(function(e) 
        {
        $('#myModal').fadeOut(); 
    });
};
</script>

1 个答案:

答案 0 :(得分:-2)

这是我在Duct Tape DANYOL

使用的内容
$(document).ready(function () {
    if (document.cookie.indexOf("shown=true")<0) {
        var show = function(){
                $('#myModal').modal('show');
        };

        $(window).load(function(){
            var timer = window.setTimeout(show,5000);
        });
    }
    document.cookie = "shown=true; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
});