jqueryオーディオボタン停止兄弟の再生

Question

私は4つのオーディオボタンを持っています。私は他の3つをクリックして停止したいと思います。私は兄弟機能を試してみましたが、他のオーディオを見つけることができないと思います。他のオーディオの再生を停止するにはどうしたらいいですか？

$(document).ready(function() { 
    var playing = false; 

    $('.audio-button').click(function() { 
     var audio = $(this).find('audio')[0]; 

     if (playing !== true) { 
      audio.play(); 
     } else { 
      audio.pause(); 
     } 

     $(this).toggleClass('playing'); 
     playing = !playing; 
     $(this).siblings().find('audio').stop(); 

    }); 
}); 

Answer 1

問題は、jquery要素でstop（）関数を呼び出しているという問題でした。私はそれらを止めるためにオーディオ要素を繰り返しただけです。

：ストップをシミュレートするには、一時停止メソッドを呼び出し、ちなみに0にCURRENTTIMEを設定する必要があり、あなたのjsスクリプトの残りの部分は、以下のこのコードスニペットを確認し、

してください）=だけで正常に見えます

var playing = false; 
 

 
$('.audio-button').click(function() { 
 
    var audio = $(this).find('audio')[0]; 
 

 
    if (playing !== true) { 
 
    audio.play(); 
 
    } else { 
 
    audio.pause(); 
 
    } 
 

 
    $(this).toggleClass('playing'); 
 
    playing = !playing; 
 
    $(this).siblings().find('audio').each(function(index, elem){ 
 

 
    elem.pause(); 
 
    elem.currentTime = 0; 
 

 
    }); 
 

 
});

.audio-button{ 
 
    width: 150px; 
 
    height: 150px; 
 
    background: orange; 
 
    text-align: center; 
 
    margin: 10px; 
 
}

<div class="audio-button"> 
 
    Click here 
 
    <audio src="http://www.nasa.gov/mp3/741263main_Bob.mp3"> 
 
    </audio> 
 
</div> 
 
<div class="audio-button"> 
 
    Click here 
 
    <audio src="http://www.nasa.gov/mp3/741261main_Charlie.mp3"> 
 
    </audio> 
 
</div> 
 
<div class="audio-button"> 
 
    Click here 
 
    <audio src="http://www.nasa.gov/mp3/741262main_Lori.mp3"> 
 
    </audio> 
 
</div> 
 
    <div class="audio-button"> 
 
    Click here 
 
\t <audio src="http://www.nasa.gov/mp3/739272main_Cut%201.mp3"> 
 
\t </audio> 
 
</div> 
 

 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>