<meta charset="UTF-8"/>
<title>
尼希米记 [Nehemiah]
</title><style>body {
font-family: Arial, sans-serif;
max-width: 600px;
margin: 20px auto;
padding: 20px;
}
#player {
margin-bottom: 20px;
}
#playlist {
list-style: none;
padding: 0;
}
#playlist li {
padding: 10px;
border-bottom: 1px solid #ddd;
cursor: pointer;
}
#playlist li:hover {
background-color: #f5f5f5;
}
#playlist li.playing {
background-color: #e3f2fd;
font-weight: bold;
}</style>
<div id="player">
<audio id="audioPlayer" controls="" autoplay="">
您的浏览器不支持音频播放
</audio>
<p>
当前播放：<span style="font-size: 16px; color: #FF0000;"><strong>圣经 _ 旧约全书 _ 尼希米记 </strong></span>-<span id="currentTrack">第?集</span>
</p>
</div>
<ul id="playlist" class=" list-paddingleft-2"></ul><script>// 播放列表数据（可修改添加更多曲目）
const playlist = [
{ title: "第1章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/1.mp3" },
{ title: "第2章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/2.mp3" },
{ title: "第3章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/3.mp3" },
{ title: "第4章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/4.mp3" },
{ title: "第5章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/5.mp3" },
{ title: "第6章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/6.mp3" },
{ title: "第7章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/7.mp3" },
{ title: "第8章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/8.mp3" },
{ title: "第9章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/9.mp3" },
{ title: "第10章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/10.mp3" },
{ title: "第11章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/11.mp3" },
{ title: "第12章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/12.mp3" },
{ title: "第13章", url: "http://audio2.abiblica.org/bibles/app/audio/4/16/13.mp3" }
];
// 初始化播放器
const audio = document.getElementById('audioPlayer');
const playlistElement = document.getElementById('playlist');
const currentTrackElement = document.getElementById('currentTrack');
let currentTrackIndex = 0;
// 生成播放列表
playlist.forEach((track, index) =>{
const li = document.createElement('li');
li.textContent = track.title;
li.addEventListener('click', () => playTrack(index));
playlistElement.appendChild(li);
});
// 播放指定曲目
function playTrack(index) {
currentTrackIndex = index;
const track = playlist[index];
audio.src = track.url;
currentTrackElement.textContent = track.title;
// 更新列表样式
Array.from(playlistElement.children).forEach(li =>
li.classList.remove('playing'));
playlistElement.children[index].classList.add('playing');
}
// 自动播放下一曲
audio.addEventListener('ended', () => {
currentTrackIndex = (currentTrackIndex + 1) % playlist.length;
playTrack(currentTrackIndex);
});</script><!--!doctype-->