我有一个用PHP + MySQL + Javascript编写的在线聊天室程序
我使用jQuery.post()
从chat.php
获取新的聊天消息。这个php程序从MySQL读取数据并将其echo
页面上。
当收到新消息时如何提醒用户?我只希望它在聊天室页面未聚焦时发出警报。
顺便问一下,闪烁网页标题是提醒用户的好主意吗?
例如,为每条消息提供一个唯一的 ID,每 5 秒轮询一次您的聊天.php并将客户端最后一条消息 ID 与您从聊天中获得的内容进行比较.php。
这很容易做到。
如果你想要一些更酷、更实时的解决方案,你应该看看 www.pubnub.com 或类似的服务。
Facebook,Skype或其他著名的"聊天室"方法。
当您为用户获得新响应时,您有两种方法:
- 您添加通知出现在窗口中(当 Skype 在 Windows 或 Mac 中...)
- 您想更改菜单中聊天按钮的颜色(并闪烁几秒钟)。
红色是侵略性的颜色,但这取决于您的网站颜色...
对于手电筒,只需几秒钟,否则用户会厌倦聊天系统......
对于网页设计最佳实践,这里有一篇非常好的文章......
要检查页面是否聚焦,您可以使用document.hasFocus
功能。如果文档已聚焦,它将返回true
,否则false
返回。
不过,Opera似乎不支持它,因此,如果支持Opera对您很重要,则可以观看window
的focus
和blur
事件,以确定窗口是否处于焦点中(这是一个示例)。
关于"如何提醒用户"的主题,这实际上由您决定。您可以按照正常方式进行操作,在标题前面加上"(x)",其中 x 是新消息的数量。你也可以使用Flash甚至更好的JavaScript Audio API来提醒用户:
var sound = new Audio('sound-file.wav');
sound.play();
不过,请务必保持音频反馈严格自愿。
如果您想格外漂亮,可以查看Chrome桌面通知。只要有新消息到达,任何运行 Chrome 的用户都可能收到桌面通知(与收到 Skype 或 MSN 消息时收到的通知相同)。下面是一个用法示例。
你必须使用HTML5标签,而不是用Javascript/JQuery控制它!
这对我有用:http://css-tricks.com/play-sound-on-hover/
在 HTML 源代码中:
<audio id="chat_sound" controls>
<source src="audio/notification.mp3" type="audio/mp3" preload="auto">
<source src="audio/notification.ogg" type="audio/ogg" preload="auto">
Your browser isn't invited for super fun audio time.
</audio>
在 JavaScript 中:
var sound_notification = $("#chat_sound")[0];
然后,您可以使用以下调用:...``
sound_notification.pause();
sound_notification.play();
。