如何解决尝试向按下的按钮添加 mp3 声音
我和 Javascript 一样绿色,但我只是希望下面的页面更改照片(它确实如此)更新文本(它确实如此)并在按下鸟名后播放鸟的歌曲。我让它使用“播放”按钮播放一首歌曲,然后我尝试将其中的一部分移动到每个功能中,没有乐趣。我试过另一个 getelementbyid(音频),但没有用,当我试图让它从每个函数中运行时我被卡住了。
我希望这很清楚,并提前感谢您的任何帮助。
<html>
<head>
</head>
<body>
<p>
<h2>Click the button to change the bird image.</h2>
</p>
<img id="myImg" src="http://www.outgrabe.net/bird04.jpg" width="207" height="198">
<p id="p1">Rose Robin by JJ Harrison (CC-by-SA)</p>
<BR></BR>
<button onclick="myFunction_1()">Pardalote</button>
<button onclick="myFunction_2()">Purple Swamp Hen</button>
<button onclick="myFunction_3()">White-headed Stilt</button>
<button onclick="myFunction_4()">Inland Thornbill</button>
<button onclick="myFunction_5()">Rose Robin</button>
<input type="button" value="PLAY" onclick="play()">
<audio id="audio" src="https://amitylabradoodles.com.au/wp-content/uploads/2021/07/Pardalote.mp3"></audio>
<script>
function myFunction_1() {
document.getElementById("myImg").src = "http://www.outgrabe.net/bird00.jpg";
document.getElementById("p1").innerHTML = "Pardalote by fir0002 (CC-by-NC)";
}
function play() {
var audio = document.getElementById("audio");
audio.play();
}
function myFunction_2() {
document.getElementById("myImg").src = "http://www.outgrabe.net/bird01.jpg";
document.getElementById("p1").innerHTML = "Purple swamp hen by Toby Hudson (CC-by-SA)";
}
function myFunction_3() {
document.getElementById("myImg").src = "http://www.outgrabe.net/bird02.jpg";
document.getElementById("p1").innerHTML = "White-headed Stilt by JJ Harrison (CC-by-SA)";
}
function myFunction_4() {
document.getElementById("myImg").src = "http://www.outgrabe.net/bird03.jpg";
document.getElementById("p1").innerHTML = "Inland Thornbill by Peter Jacobs (CC-by-SA)";
}
function myFunction_5() {
document.getElementById("myImg").src = "http://www.outgrabe.net/bird04.jpg"
document.getElementById("p1").innerHTML = "Rose Robin by JJ Harrison (CC-by-SA)";;
}
/* The links to the MP3 flies
Pardalote
https://amitylabradoodles.com.au/wp-content/uploads/2021/07/Pardalote.mp3
Purple Swamp Hen
https://amitylabradoodles.com.au/wp-content/uploads/2021/07/Purple-Swamphen.mp3
White-headed Stilt
https://amitylabradoodles.com.au/wp-content/uploads/2021/07/White-backed-Stilt-bird-sounds.mp3
Inland Thornbill
https://amitylabradoodles.com.au/wp-content/uploads/2021/07/Inland-Thornbill.mp3
Rose Robin
https://amitylabradoodles.com.au/wp-content/uploads/2021/07/Rose-Robin.mp3 */
}
</script>
</body>
</html>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。