15158846557 在线咨询 在线咨询
15158846557 在线咨询
所在位置: 首页 > 营销资讯 > 网站运营 > 想要那种有提示声音的网站吗?我教你怎么做!

想要那种有提示声音的网站吗?我教你怎么做!

时间:2023-07-06 09:00:02 | 来源:网站运营

时间:2023-07-06 09:00:02 来源:网站运营

想要那种有提示声音的网站吗?我教你怎么做!: 您有新的外卖订单请及时查收!
熟悉不能再熟悉的声音了,今天小编就做了这样一个网站的提示新订单的功能,接下来就教你怎么玩转这个小功能!



首先我们前端的代码是这样写的:


var playSound = function () { var borswer = window.navigator.userAgent.toLowerCase(); if ( borswer.indexOf( "ie" ) >= 0 ) { //IE内核浏览器 var strEmbed = '<embed name="embedPlay" src="/public/Mp3/newOrder.mp3" autostart="true" hidden="true" loop="false"/>'; if ( $( "body" ).find( "embed" ).length <= 0 ) $( "body" ).append( strEmbed ); var embed = document.embedPlay; //浏览器不支持 audion,则使用 embed 播放 embed.volume = 100; } else { //非IE内核浏览器 var strAudio = "<audio id='audioPlay' src='/public/Mp3/newOrder.mp3' hidden='true'>"; if($("#audioPlay").length<=0){ $( "body" ).append( strAudio ); } var audio = document.getElementById( "audioPlay" ); //浏览器支持 audio audio.play(); } }/**新订单*/function getNewOrder(){ $.post("{:U('Msg/newOrder')}", {}, function(res) { if (res) { playSound(); $.post("{:U('Msg/msgDetail')}", {id:res.id}, function(res) {}); } });}window.setInterval("getNewOrder()",3000);
以上是做ajax的轮询操作,当然你做成websockt也是可以的,本文就作为一个抛砖引玉的作用吧。
后端的话,可以去数据库查询,也可以在前端做好redis缓存,或者其他缓存,然后从缓存里面获取数据等等都是可以的!



是不是很简单,快去尝试一下吧!


http://weixin.qq.com/r/FDji_tDElY3qrZSZ920G (二维码自动识别)



关键词:提示,声音

74
73
25
news

版权所有© 亿企邦 1997-2025 保留一切法律许可权利。

为了最佳展示效果,本站不支持IE9及以下版本的浏览器,建议您使用谷歌Chrome浏览器。 点击下载Chrome浏览器
关闭