原理或者流程:
页面加载完成后,启动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();
});
});