原理或者流程:
页面加载完成后,启动js定时器-----》1,请求服务端数据------->1,返回页面-----》3,判断是否有消息,然后开启声音提醒
--------》循环1,2,3
先附上页面的html代码:需要一些事先隐藏的div
//隐藏的商店id <input type="hidden" id="mid" value="<s:property value="#session.managerMerchant.id"/>"/> <%-- 判断是否为校园商店以显示消息提醒--%> <s:if test="%{#session.managerMerchant.type==1}"> <%-- 隐藏的消息框及音乐标签--%> <!-- jquery-1.7.1 --> <script type="text/javascript" src="${path}/js/client/jquery-1.7.1.min.js"></script> <script type="text/javascript" src="${path}/js/back/MerchantMessagePush.js" charset="utf-8"></script> <%-- 隐藏在页面的系统路径--%> <input type="hidden" id="path" value="${path}"/> <div id="message" style="width: 180px;height: 30px;border: solid 1px red;position:fixed;left: 410px;top: 5px;background-color:white;display:none;"> <a target="right" href="merchantManageAction_listUntreatedBuyMessage.action?mid=<s:property value="%{#session.managerMerchant.id}"/>" sty le="colo r: red;">你有(<span id="sum">3</span>)条新购买留言! </a> <img id="colse" src="images/client/xx3.jpg"/> <div id="ms" > <%--<EMBED src='upload/music/a.mp3' autostart='true' HIDDEN='true' loop='true' id='a'>--%> </div> </div> </s:if> <s:if test="%{#session.managerMerchant.type==1}"> <button id="colsemusic">关闭声音提醒</button><button id="openmusic" style="display: none;">开启声音提醒</button> </s:if>
MerchantMessagePush.js源码
//商店消息推送 $().ready(function(){ var mid = $("#mid").val();//获取页面隐藏商店id的值 var path = $("#path").val();//获取系统路径名 var time = 50000; //定时的时间 var interval;//定时器 var message = $("#message");//页面消息框 var sum = $("#sum");//页面消息框中的具体数字 var ms = $("#ms");//页面装音乐标签的外层div var index = 0;//声音开关变量 0为打开声音提醒 1为关闭 //音乐标签内容设置 var musicTag = "<EMBED src='"+path+"/upload/music/xiaoxi.mp3' autostart='true' hidden='true' loop='false' id='a' volume='100'>"; function run(){ interval = setInterval(fun,time); }; function fun(){ //alert("定时执行的方法"); $.post('merchantManageAction_messagePush.action',{'mid':mid},function(data){ if(data==0){//没有消息 //删除以前的音乐标签内容 ms.text(""); //让消息框显示 message.hide(); }else{ //更新消息数字 sum.text(data); //让消息框显示 message.show(); //删除以前的音乐标签内容 ms.text(""); //判断声音开关变量值,为0则重新加载音乐标签 if(index==0){ ms.append(musicTag); } } }); }; run(); //绑定关闭消息框及声音事件 $("#colse").unbind('click'); $("#colse").bind('click',function(){ //让消息框显示 message.hide(); //删除以前的音乐标签内容 ms.text(""); }); //绑定关闭声音的按钮事件设置 $("#colsemusic").unbind('click'); $("#colsemusic").bind('click',function(){ index = 1;//更改声音开关变量值 $("#colsemusic").hide(); $("#openmusic").show(); }); //绑定开启声音的按钮事件设置 $("#openmusic").unbind('click'); $("#openmusic").bind('click',function(){ index = 0;//更改声音开关变量值 $("#openmusic").hide(); $("#colsemusic").show(); }); });