Question

我有一个我在我的网站上播放的歌曲列表，我希望能够显示当前播放的歌曲名称，我有这个代码有播放，暂停，下一个，后退，哪个工作正常，但我需要编辑它以显示歌曲名称

    <body>
                <a class="btn" href="#" id="play" style="background-color:black">Play </a> 

                <a  class="btn"  href="#"  style="background-color:black" id="pause">Pause</a>
                <br>

                <a  class="btn"  href="#" style="background-color:black" id="skip">Next </a> 

                <a  class="btn"  href="#"  style="background-color:black" id="previous">Back</a>

 <audio    preload="metadata" tabindex="0" controls autoplay type="audio/mpeg"   class="audio-player" src="dz.mp3"></audio>

          <audio  class="audio-player" src="song2.mp3"></audio>

        <audio  class="audio-player" src="song3.mp3"></audio>

            <body>

这是我的脚本

<script>
var x = $(".audio-player").length;
var z = 0;
var songName = $("audio[name]")

$("#play").click(function(){
    $(".audio-player")[z].play();
    $("#song-name").text(songName);
    $("#song-name").show();
})
$("#pause").click(function(){
    $(".audio-player")[z].pause();
    $("#song-name").hide();
})
$("#skip").click(function(){
    $(".audio-player")[z].pause();
    z++;
    if (z >= x) z = 0;
    $(".audio-player")[z].play();
    $(".audio-player")[z].currentTime = 0;
    $("#song-name").text(songName);
})




$("#previous").click(function(){
    $(".audio-player")[z].pause();
    z=z-1;
    if (z >= x) z = 0;
    $(".audio-player")[z].play();
    $(".audio-player")[z].currentTime = 0;
    $("#song-name").text(songName);
})
</Script>

显示歌曲名称jquery

0 个答案: