菜单栏通知徽章更新问题

Posted

技术标签:

【中文标题】菜单栏通知徽章更新问题【英文标题】:Menu bar notification badge update issue 【发布时间】:2013-05-17 20:36:17 【问题描述】:

我有一个带有通知气泡徽章 (CSS3) 的菜单栏,以及一个用于从 mysql 数据库(信使收件箱系统)检索新消息计数的 php 脚本。我想用脚本中未读消息的数量每秒更新一次通知徽章的值,或者如果脚本结果为 0(没有新消息),则完全隐藏容器。

【问题讨论】:

【参考方案1】:

醒了 48 小时后我终于想通了!

setTimeout('pullNewMessageCount()', 200);
function pullNewMessageCount() 
var url = 'models/bubble.php';
$.ajax(
url: url,
dataType: 'html',
type: 'POST',
success: function(latestCount) 
 setTimeout('pullNewMessageCount()', 200);
 $('#bub').html(latestCount);
 if (latestCount > 0)
 
   $('#bub').removeClass('hidden').addClass('bubble').addClass('animating');
  else if ((latestCount = $('#bub').html()) && (latestCount > 0)) 
   $('#bub').removeClass('animating');
  else if ((latestCount = '0') || (!latestCount)) 
   $('#bub').removeClass('bubble').addClass('hidden');
  else 
   $('#bub').removeClass('bubble').addClass('hidden');
 
,
error: function(jqXHR, textStatus, errorThrown) 

);

最后是一个类似于 facebook 的通知气泡系统!

【讨论】:

以上是关于菜单栏通知徽章更新问题的主要内容,如果未能解决你的问题,请参考以下文章

像 Google 一样的操作栏通知计数图标(徽章)

Android 操作项上的通知徽章

如何在 react-native 中更新 Tab Navigator 中徽章计数器的状态

GTK3 更新菜单栏和菜单项

Bootstrap:在标题(导航栏)中实现类似 facebook 的通知作为子菜单,而不仅仅是计数器

Mac电脑如何让聚焦功能显示在菜单栏?