原创

利用cookies实现对弹出窗口频率的控制

原理：

当用户第一次访问网站时候，此时没有设置cookies参数,并且设置过期，弹出显示对话框，弹完之后，设置cookies参数"popped=yes;expires="+date.toGMTString()"，第二次加载时候，判断存在这个参数，则跳过加载对话框，cookies失效后，浏览器会自动删除失效的参数

代码：

JS/css引入

<link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css"> <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script> <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>

JS函数

<script> $(function() { if (get_cookie('popped')==''){ $("#dialog-modal").show(); $( "#dialog-modal" ).dialog({ height: 410, width: 815, modal: true }); var date=new Date(); date.setTime(date.getTime()+12*60*60*1000); //设置date为当前时间+30分 document.cookie="popped=yes;expires="+date.toGMTString(); }else{ $("#dialog-modal").hide(); } }); function get_cookie(Name) { var search = Name + "=" var returnvalue = ""; if (document.cookie.length > 0) { offset = document.cookie.indexOf(search) if (offset != -1) { offset += search.length end = document.cookie.indexOf(";", offset); if (end == -1) end = document.cookie.length; returnvalue=unescape(document.cookie.substring(offset, end)) } } return returnvalue; } </script>

DIV模块

<div id="dialog-modal" title="关注公众号（Java杂记），领取免费的学习资源，目前受益良多" style="width: auto;min-height: 0px;max-height: none;height: 360px;display:none;"> <p><img src="http://www.liuhaihua.cn/wp-content/uploads/2018/07/888.png" data-baiduimageplus-ignore data-tag="bdshare"/></p> </div>