Question

页脚上有三个标签：主页，促销和活动。我实施了通知徽章，以便在数据库中加载新促销时，移动页面的页脚显示1，如果插入更多，则数字会实时递增。现在，比如说，如果我从主页开始，我会在促销和活动标签上看到实时通知。但是，当我导航到事件选项卡时，通知会消失，但如果我单击返回主页选项卡，则会显示通知。我试过＆＃34; pageinit＆＃34;和＆＃34; pageshow＆＃34;单独使用其他stackoverflow问题中建议的测试警报消息。每次单击选项卡时都会显示警报消息。但是，当我尝试使用append或html进行修改时，它不会输出通知徽章。我尝试将id添加到data-role =页面用于主页，促销和事件，警报显示，但是append或html函数没有按预期给我结果。我在这里缺少什么？

    <div data-role="page">

         <div data-role="header">
            ........
         </div>


         <div data-role="content">
                 .......
         </div>

        <div data-role="footer" data-position="fixed" >
             <div data-role="navbar" >
                 <ul>
                                   <!---- The notification badge from jquery script get appended in these IDs----->
                                 **<li><div id="home"></div>...........</li>**
                                 **<li><div id="promotion"></div>......</li>**
                                 **<li><div id="event"></div>..........</li>**
             </div>
        </div>
    </div>

Answer 1

我认为如果我的第一页是主页，JQuery Mobile会将其存储在其历史记录中，而访问的任何其他页面都将是ajax调用。而且，我一直在他们所属的页面中保存通知徽章。例如。如果正在添加新的促销，则会将其附加到promotion.mobile.erb，如果添加了新事件，则会将其附加到event.mobile.erb中的div元素。只有当前页面是主页，我才能看到它。这是我之前的问题。

我是如何解决的？我从application.mobile.erb中解除了我的页脚和页面元素，并将页面ID添加到了主页，促销和事件页面。然后，我在通知标记所在的div元素中添加了不同的ID。

对于home_page中的div元素，我添加了0（你可以选择使它独特的任何东西）
对于promotion_page中的div元素，我添加了1和

对于event_page中的div元素，我在下面的代码中添加了2 ...

<div data-role="footer" data-position="fixed" >
     <div data-role="navbar" >
         <ul>
                           <!---- The notification badge from jquery script get appended in these IDs----->
                         **<li><div id="home0"></div>...........</li>**
                         **<li><div id="promotion0"></div>......</li>**
                         **<li><div id="event0"></div>..........</li>**
     </div>
</div>

现在，当任何实时通知出现时，将其添加到promotion0或event0 div，这样每当我们离开时，我们都可以从该div获取旧徽章，并使用pageinit将其重新发布到导航页面div元素比如下面的例子......

   $('#promo_page').live('pageinit',function(event){
        $('#promotion2').badger(oldBadge0);
        $('#event2').badger(oldBadge_e0);
    });

导航时，JQuery Mobile不会更新或重新发布数据

1 个答案: