Question

我有以下播放音频文件的代码。当我点击一首歌时，其他所有人都必须停止。这有效但图像仅在播放或暂停同一首歌时才会改变。然而，当我点击另一首歌时，前一首歌会暂停。

我希望上一张图片从暂停变为播放。你能帮助我吗？这首歌有一个foreach循环。

您可以在此处试用：http://mp3-musicon.de/mp3_download/index_mobil.php

<script type="text/javascript"> 
    var currentsound;
    function play_pause(player) {
    var myAudio = document.getElementById(player);
        if(myAudio.paused) {
        myAudio.play();
        } else{
        myAudio.pause();
        }
        $("audio").on("play", function(){
    var _this = $(this);
    $("audio").each(function(i,el){
        if(!$(el).is(_this))
            $(el).get(0).pause();
    });
});
                                }
    function changeImage(img) {
    var imgfile = img.src.split(/\s+/).pop();   
    if (imgfile =="http://mp3-musicon.de/mp3_download/images/playbuttons/pause1.png" ) 
    {
        img.src = "http://mp3-musicon.de/mp3_download/images/playbuttons/play1.png";
    }
    else 
    {
        img.src = "http://mp3-musicon.de/mp3_download/images/playbuttons/pause1.png";
    }
                    }
</script>

<audio id="myAudio<?= $song['id'] ?>" src="http://mp3-musicon.de/mp3_download/store/<?php print $song["file"]; ?>" type="audio/mpeg"></audio>
<div style="float:left; margin-right:8px; margin-top:4px;">
<img src="http://mp3-musicon.de/mp3_download/images/playbuttons/play1.png" width="17" height="17" border="0" onclick="play_pause('myAudio<?= $song['id'] ?>');changeImage(this)">
</div>

Answer 1

可能就是这样：

 <script type="text/javascript"> 
    var currentsound;
    var currentimg;
    function play_pause(player,img) {
    if ( currentimg ){
        currentimg.src = "http://mp3-musicon.de/mp3_download/images/playbuttons/play1.png";
    }
    var myAudio = document.getElementById(player);
        if(myAudio.paused) {
        myAudio.play();
        img.src = "http://mp3-musicon.de/mp3_download/images/playbuttons/play1.png";
        } else{
        myAudio.pause();
        img.src = "http://mp3-musicon.de/mp3_download/images/playbuttons/pause1.png";
        }
        $("audio").on("play", function(){
    var _this = $(this);
    $("audio").each(function(i,el){
        if(!$(el).is(_this))
            $(el).get(0).pause();
    });
    currentimg = img;
});
                                }

</script>

<audio id="myAudio<?= $song['id'] ?>" src="http://mp3-musicon.de/mp3_download/store/<?php print $song["file"]; ?>" type="audio/mpeg"></audio>
<div style="float:left; margin-right:8px; margin-top:4px;">
<img src="http://mp3-musicon.de/mp3_download/images/playbuttons/play1.png" width="17" height="17" border="0" onclick="play_pause('myAudio<?= $song['id'] ?>',this); ">
</div>

音频更改图像播放/暂停javascript

1 个答案: