当我点击下面有代码但按钮不起作用的按钮时,我试图播放声音。
我还希望在播放声音时播放图标会停止播放。
但它不起作用,你看到问题出在哪里了吗?
http://jsfiddle.net/804jeg82/351/
jQuery的:
.alphabetNav li {
border-top-left-radius:5px;
border-top-right-radius:5px;
}
答案 0 :(得分:1)
您忘记了audio
元素。顺便说一句,id必须在你的html中是唯一的。
根据w3school:
id属性指定HTML元素的唯一ID(值 在HTML文档中必须是唯一的。)
var playBtn = document.getElementById('play');
var audio = document.getElementById('audio');
var stopbtn = document.getElementById('stop');
var playSound = function () {
audio.play();
};
var stopSound = function () {
audio.pause();
audio.currentTime = 0;
};
playBtn.addEventListener('click', playSound, false);
stopbtn.addEventListener('click', stopSound, false);
var playBtn = document.getElementById('play');
var audio = document.getElementById('audio');
var stopbtn = document.getElementById('stop');
var playSound = function () {
audio.play();
};
var stopSound = function () {
audio.pause();
audio.currentTime = 0;
};
playBtn.addEventListener('click', playSound, false);
stopbtn.addEventListener('click', stopSound, false);

<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"/>
<div class="sounds"> <a href="#" class="btn">
Mountain 1
<audio id="audio" src="http://download.wavetlan.com/SVV/Media/HTTP/MP3/Nero_SmartTrax/NeroSmartTrax_test4_MPEG2_Mono_CBR_40kbps_24000Hz.mp3" preload="auto" ></audio>
</a>
<br> <i id="play" class="fa fa-play"></i>
<br> <i id="stop" class="fa fa-stop"></i>
</div>
&#13;