<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<audio id="myAudio">
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
您的浏览器不支持 audio 与元素。
</audio>
<p>点击按钮播放后暂停音频。</p>
<button οnclick="playAudio()" type="button">播放音频</button>
<button οnclick="pauseAudio()" type="button">暂停音频</button>
<script>
var x = document.getElementById("myAudio");
function playAudio()
{
x.play();
}
function pauseAudio()
{
x.pause();
}
</script>
</body>
</html>
如遇到错误信息:Uncaught (in promise) DOMException: play() failed because the user didn't in
解决办法:
Chrome的autoplay政策在2018年4月做了更改。
新的行为:浏览器为了提高用户体验,减少数据消耗,现在都在遵循autoplay政策,Chrome的autoplay 政策非常简单
1. muted autoplay始终被允许
2. 音乐的autoplay 只有在下面集中情况下起作用:
1. 有用户行为发生像(click,tap,etc).
2. 对于桌面程序,用户已经提前播放了音频
3. 对于移动端用户将音频网址home screen.
解决方案:
Open chrome://flags/#autoplay-policy
Setting No user gesture is required
Relaunch Chrome
<a href="#" οnclick="ajaxfresh('http://localhost:8088/mx/jcorder')" style="display: none;"></a>
<div id="mainContent" style="display: none;"></div>
<script type="text/javascript">
//setInterval("Mx.jcorder()","10000");
setInterval("ajaxfresh(Feng.ctxPath + '/mx/jcorder')","10000");
function ajaxfresh(url){
$.ajax({
type : "get",
async : false,
url : url,
success: function(page){
$("#mainContent").html(page);
},
error : function(){
console.log("faild");
}
});
}
</script>
@RequestMapping("/jcorder")
public String jcorder(){
return "/te.html";
}