商城订单实时语音提醒功能JavaScript部分 附提醒语音音频文件

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接： https://blog.csdn.net/qq_31766533/article/details/98727193

第一步，按钮控制实时提醒

<form class="layui-form roll-nav" style="margin-left: 81%;margin-top: -5px;" action="">
    <input type="checkbox" checked="" name="switch" lay-skin="switch" lay-filter="switchTest" lay-text="ON|OFF">
</form>

第二步，在页面中加一个audio,，加载你引用的音频文件，并隐藏掉

 <audio id='audioPlay' src='{__FRAME_PATH}notice.mp3' hidden='true'>

第三步，利用js中的setInterval() 方法一直轮询查找后台返回的 ordernum 值，当值大于0 且实时提醒开关打开时，执行音频播放。

<script>
    layui.use(['form'], function(){
        var form = layui.form
            ,layer = layui.layer
        //监听实时提醒开关
        var timer;
        form.on('switch(switchTest)', function(data){
            if(this.checked){
                layer.msg('实时提醒：'+ (this.checked ? '已开启' : 'false'), {
                    offset: '6px'
                });

                timer = setInterval(domusic, 5000);
                function domusic(){
                    var ordernum = $('#ordernum').html().substr(0,1);
                    if(ordernum>0){
                        document.getElementById('audioPlay').play();
                    }
                }
                domusic();
            }else{
                layer.msg('实时提醒：已关闭', {
                    offset: '6px'
                });
                clearInterval(timer);
            }

        });
    });

</script>

语音提醒音频文件下载