<html>
<head lang="en">
<meta charset="UTF-8">
<title>微信中也能播放mp3</title>
<script src="jquery-1.10.2.min.js"></script>
</head>
<body>
<audio id="music" loop="loop" style="display: none;"></audio>
<!--前台显示音乐按钮-->
<div id="btn-music" >
<a class="aui-pull-left aui-btn" href='javascript:void(0)' οnclick="play_on()" >
<img src="btn_music_on.png" alt="" id="btn-music-on" />
</a>
<a class="aui-pull-left aui-btn" href='javascript:void(0)' οnclick="play_off()" >
<img src="btn_music_off.png" alt="" id="btn-music-off" class="hide" />
</a>
</div>
<script>
var c = document.getElementById("music");
c.src = "mp3.mp3";
c.play();
//处理微信的时候
document.addEventListener("WeixinJSBridgeReady", function () {
if (typeof WeixinJSBridge == "object") {
WeixinJSBridge.invoke("getNetworkType", {}, function (j) {
c.play();
})
}
});
music_state = 1;
//音乐按钮
</script>
<script>
function play_on() {
c.play();
music_state = 1;
$("#btn-music-on").removeClass("hide");
$("#btn-music-off").addClass("hide");
}
function play_off() {
alert("off");
c.pause();
music_state = 0;
$("#btn-music-off").removeClass("hide");
$("#btn-music-on").addClass("hide");
}
</script>
</body>
</html>
【提醒】：里边的图片和mp3文件需要对应你自己的图片和mp3文件。
529
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
