jqueryMobile对话框每次在页面显示时打开，即使设置了cookie

jqueryMobile Dialog opens every time on pageshow even with cookie set

本文关键字：设置 cookie 对话框 显示 jqueryMobile      更新时间：2023-09-26

每次加载页面时都会打开jQuery移动对话框。即使将cookie设置为只打开一次而不再打开，它也会在每次刷新时继续打开。我不知道为什么它没有触发就加载了?任何帮助都会很感激。

JAVASCRIPT 

function openDialog() {
var interval = setInterval(function(){
       $.mobile.changePage('#dialog');
       clearInterval(interval);
},1);  
}
$(function() {
if ($.cookie('dialog_shown') == null) {
   $.cookie('dialog_shown', 'yes', { expires: 7, path: '/' });
        $(document).on('pageshow', '#index', function(){   
            openDialog();   
        }); 
    } 
});
HTML 

<body>
<div data-role="dialog">
    <div data-role="header" data-theme="d">
        <h1>Custom Dialog</h1>
    </div>
    <div data-role="content">
        <h1>Customize the HTML. Have any content you want in here.</h1>
        <p>This is a regular page, styled as a dialog. To create a dialog, just link to a normal page and include a transition and <code>data-rel="dialog"</code> attribute.</p>
        <a href="#index" data-role="button" data-theme="b">Button Style</a>       
        <a href="#index" data-role="button" data-theme="c">Cancel</a>    
    </div>
</div>
<div data-role="page" id="index">
</div>
</body>

jquery mobile将在没有选择页面时加载正文中的第一个页面或对话框。所以你的HTML应该像这样:

<body>
   <div data-role="page" id="index">
   </div>
   <div data-role="dialog">
    .......
   </div>
</body>

第二件事是如果cookie不存在，它将返回undefined而不是null。所以:

if ($.cookie('dialog_shown') === undefined) { ..}

第三件事是你没有设置对话框的id:

<div data-role="dialog" id="dialog">

你的代码应该是:

   $(document).delegate('#index','pageshow',  function(){   
      if ($.cookie('dialog_shown') === undefined) {
           $.cookie('dialog_shown', 'yes', { expires: 7, path: '/' });
           openDialog();
      }      
   });
相关文章：