当我的闹钟打开时,我的音频没有播放。我已经得到了代码的url和id,但是当我在定时器关闭时播放它时,音频也没有播放。这有什么问题?
<!DOCTYPE html>
<html>
<head>
<link rel='stylesheet' href='style.css'/>
<script src='script.js'></script>
<style type="text/css">
.time {
background-color:#000;
border:#026efc 4px inset;
padding:6px;
color:#0FF;
font-family:"Silom";
font-size:20px;
font-weight:bold;
letter-spacing:2px;
display:inline;
}
</style>
<script type="text/javascript">
var set=0;
var audio = document.getElementById('BGSOUND_ID');
ver=parseInt(navigator.appVersion);
ie4=(ver>3 && navigator.appName!="Netscape")?1:0;
function play() {
if (ie4)
document.all['BGSOUND_ID'].src="http://hopto.redirectme.net/Audio/Alarm%20Beeps.mp3";
document.getElementById('BGSOUND_ID').play();
}
function setv() {
var hr2 = document.getElementById('hour2').value;
var min2 = document.getElementById('min2').value;
var sec2 = document.getElementById('sec2').value;
if(hr2<10)
hr2='0'+hr2;
if(min2<10)
min2='0'+min2;
if(sec2<10)
sec2='0'+sec2;
document.getElementById('d2').value=hr2+'*'+min2+'*'+sec2;
set=1;
document.getElementById('msg').innerHTML='Alarm is ON';
}
function dis() {
var dat= new Date();
var hr=dat.getHours();
var min=dat.getMinutes();
var sec=dat.getSeconds();
if(hr<10)
hr='0'+hr;
if(min<10)
min='0'+min;
if(sec<10)
sec='0'+sec;
document.getElementById('hour').value=hr;
document.getElementById('min').value=min;
document.getElementById('sec').value=sec;
var dat2v=document.getElementById('d2').value;
var dats =hr+'*'+min+'*'+sec;
if(dat2v==dats && set) {
play();
var x = confirm("Snooze?");
if(x) {
document.getElementById('BGSOUND_ID').pause();
audio.currentTime=0;
}
document.getElementById('msg').innerHTML='Alarm is OFF';
set=0;
}
setTimeout("dis()",500);
}
function prtsel(x) {
for(var i=0;i<x;i++)
document.write("<option value="+i+">"+i+"</option>");
}
</script>
</head>
<body>
<table align=center width=45%>
<tr><td>
<body onload=dis()>
<audio id="BGSOUND_ID" src="http://hopto.redirectme.net/Audio/Alarm%20Beeps.mp3/" LOOP=1>
</audio>
<input type=hidden id=d2 name=d2>
<input type=text id=hour name=hour size=1 class=time> :
<input type=text id=min name=min size=1 class=time> :
<input type=text id=sec name=sec size=1 class=time>
<br/>
<select id=hour2 name=hour2 onChange="setv()">
<script type='text/javascript'>prtsel(25);</script>
</select>
<select id=min2 name=min2 onChange="setv()">
<script type='text/javascript'>prtsel(61);</script>
</select>
<select id=sec2 name=sec2 onChange="setv()">
<script type='text/javascript'>prtsel(61);</script>
</select>
<div id=msg>Alarm is OFF</div>
</body>
</td></tr></table>
</body>
</html>
答案 0 :(得分:2)
问题是音频标签的来源。网址应遵循以下格式:protocol://host/path
。您的音频源以斜线结尾,表示子目录。如果您要查看浏览器的网络选项卡,您会看到一个失败的请求。
音频标签源的标记也(在我看来)格式不正确。
它应该如下所示:
<audio controls>
<source src="http://hopto.redirectme.net/Audio/Alarm%20Beeps.mp3" type="audio/mpeg">
Your browser does not support this audio format.
</audio>
这允许您指定多个来源,因此让浏览器决定它想要播放的内容,具体取决于它最支持的内容......
此外,变量audio
正在求值为null,因为代码执行时尚未呈现音频元素。因此,您可以将脚本移至HTML标记之后,或仅在加载正文时在dis()
函数中设置变量。