There is a JS code and this is the only way it works on the phone, otherwise it does not !!!

On page 20 blocks with its audio file inside this block. looks like that!

And click on each element plays its own melody! Ie, we click on any element playing a sound, if you click on the second, then the previous one has stopped the sound, and the current one has a click on the melody!

<div class="test"> <p>БЛОК-1!</p> <audio src="1.mp3" type="audio/mpeg"></audio> </div> 

There can be 1000 such blocks !!!

Here is the JS code that handles the code!

 var blocks = document.querySelectorAll('.test'); for(var i = 0; i < blocks.length; i++) { var block = blocks[i]; block.onclick = function() { //действие при клике var path = '/android_asset/www/audio/'; var audioName = this.querySelector('audio').getAttribute('src'); var fullPath = path+audioName; var local1 = new Media(fullPath); local1.play(); }//конец функции }//конец цикла } 

How to stop playing an audio file when clicking on another item? And yes, if you translate the variable into the global, it does not work !! (remove from the function).

there are click methods. play(); stop(); pause();

I suffer already which day. offered this code in one forum, on the browser it works perfectly, but does not work on the android application below 5.0, and 5.0 and above without any complaints !! LINK TO JSFiddle CODE

    1 answer 1

    Like this

     document.addEventListener('play', function(e) { var audios = document.getElementsByTagName('audio'); for(var i = 0; i < audios.length; i++) { if(audios[i] != e.target) { audios[i].pause(); } } }, true); 
     Аллесандро Марчелло - 1. Andante (oboe concert) <br><audio id="audio1" preload="metadata" controls> <source src="http://xn----7sbab5aqcbiddtdj1e1g.xn--p1ai/mp3/music/a.marcello/Аллесандро Марчелло - 1. Andante (oboe concert).mp3"> <track label="Аллесандро Марчелло - 1. Andante (oboe concert)"> </audio><br><br> Аллесандро Марчелло - 2. Adagio (oboe concert) <br><audio id="audio2" preload="metadata" controls> <source src="http://xn----7sbab5aqcbiddtdj1e1g.xn--p1ai/mp3/music/a.marcello/Аллесандро Марчелло - 2. Adagio (oboe concert).mp3"> <track label="Аллесандро Марчелло - 2. Adagio (oboe concert)"> </audio><br><br> Аллесандро Марчелло - 3. Presto (oboe concert) <br><audio id="audio3" preload="metadata" controls> <source src="http://xn----7sbab5aqcbiddtdj1e1g.xn--p1ai/mp3/music/a.marcello/Аллесандро Марчелло - 3. Presto (oboe concert).mp3"> <track label="Аллесандро Марчелло - 3. Presto (oboe concert)"> </audio><br><br> 

    • ID elements are optional - Vladlen Vozhzhaev
    • 1 you have it goes through all the tags of the audio elements found. 2 in your audio files set controls. which is visible on the screen, but it is not accepted by me !! 3. see how my file path is formed. - MODERN
    • I threw the idea of ​​how I implemented it. You can extract only what you need from my code. We here do not write programs to order, but prompt. - Vladlen Vozhzhaev
    • Thank you for this, there is simply a conel in these mobile applications, and if in the browser, then on JQ it is easy to organize. The question is how to correctly output a variable from a function and make it global only so that it preserves the same path when clicked? - MODERN