SpringBoot+thymeleaf+html+javascript 实现的点击播放mp3简单的一个功能

Amelia__Q

于 2020-08-07 14:04:37 发布

阅读量1.5k

点赞数

CC 4.0 BY-SA版权

分类专栏： java 文章标签： js html5

本文链接：https://blog.csdn.net/Amelia__Q/article/details/107860992

java 专栏收录该内容

23 篇文章

订阅专栏

MP3文件所在目录

页面按钮

 <button class="search-btn primary" type="button" onclick="playmp3()">点击播放</button>
 <audio id='audioPlay' th:src='@{/stc/mp3/query.mp3}'  hidden autostart="false"></audio>
<embed name="embedPlay" th:src='@{/stc/mp3/query.mp3}' autostart="false" hidden="true" loop="false">



function  playmp3() {

            var borswer = window.navigator.userAgent.toLowerCase();
            if ( borswer.indexOf( "ie" ) >= 0 )
            {
                //IE内核浏览器
                var embed = document.embedPlay;
                //浏览器不支持 audion，则使用 embed 播放
                embed.volume = 100;
                embed.play();
            } else
            {
                var audio = document.getElementById("audioPlay");
                //浏览器支持 audio
                audio.play();
            }
        };

这个过程中遇到个坑，我用谷歌浏览器的时候，浏览器设置的是自动播放加载音视频，所以一进页面不点击也会播放音频