在java web认证系统开发中，客户要求有数据更新时要在页面弹出提示框，这样方便在旁边的工作人员可以及时的知道有新数据提交了，我们除了使用及时的推送技术外还可以使用ajax来实现这些功能。
代码实现的原理，在页面启用定时执行ajax请求，如果获得数据是最新状态的，要执行语音提示和弹出框提示，这样实现的弊端是频繁的调用数据库，该方法只适合于使用人数较少的系统。
1、加入语音提示

动态加入播放语音文件代码：
document.getelementbyid(sound).src=admin/media/global.wav;
2、动态弹出消息提示框：
在此处我导入了jquery.gritter.js和jquery.gritter.css,具体实现代码：
jquery(document).ready(function() { setinterval(function(){ $.post('ajax/linecheck',function(data){var json=eval((+data+));$.each(json,function(index,item){$(#line+item.id).html()$.each(item.locallist,function(index,item2){if(item2.attendoclist!=){$(#line+item.id).append(+item2.location+
)}$.each(item2.attendoclist,function(index,item3){if(item3.status==0){$(#li+item2.id).append(+item3.person_name+
时间: + item3.today+ +item3.times +
电话:+item3.person_phone+
身份证:+item3.card_id+);}else{$(#li+item2.id).append(+item3.person_name+
时间: + item3.today+ +item3.times +
电话:+item3.person_phone+
身份证:+item3.card_id+);document.getelementbyid(sound).src=admin/media/global.wav;settimeout(function () {var unique_id = $.gritter.add({title: item3.person_name+(+item2.location+),text:+item3.person_name+
时间: + item3.today+ +item3.times +
电话:+item3.person_phone+
身份证:+item3.card_id+,sticky: true,time: '',class_name: 'my-sticky-class'});settimeout(function () {$.gritter.remove(unique_id, {fade: true,speed: 'slow'});}, 12000);}, 2000);}});});});});},2000); });
以上内容是小编给大家介绍的js实时弹出新消息提示框并有提示音响起的实现代码，希望对大家有所帮助！