1

我在页脚上有三个标签：主页、促销和活动。我已经实现了通知徽章，这样当数据库中加载新的促销时，移动页面的页脚显示 1，如果插入更多，数字会实时增加。现在，比如说，如果我从主页开始，我会在促销和活动选项卡上看到实时通知。但是，当我导航到事件选项卡时，通知就会消失，但是如果我单击返回主页选项卡，通知就会显示出来。我已经分别尝试了“pageinit”和“pageshow”，以及其他stackoverflow问题中建议的测试警报消息。每次单击选项卡时都会显示警报消息。但是，当我尝试使用 append 或 html 进行修改时，它不会向我输出通知徽章。我尝试将 id 添加到 data-role=page for home，促销和事件，警报出现，但附加或 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>
4

1 回答 1

0

我想如果我的第一个页面是主页，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);
    });
于 2012-06-08T20:56:03.057 回答