HTML5/jQuery audio shuffle onClick

2019-08-02 21:25发布

问题:

I have a simple HTML5 audio playlist and I would like the user to click a "shuffle" button and shuffle the audio but I don't know the best way to go about this. I'm using audio.js for HTML5 audio.

http://jsfiddle.net/HxVaj/4/

As you can see in the fiddle, audio.js grabs the <a> tag inside the <li> to play an audio file in the player at the top. The shuffle button would need to pick a random <li a> on click.

Any help would be greatly appreciated! Thank you!

回答1:

Here is the logic for shuffle button. You'll have to write in the code to the get the track to play but it shouldn't be that difficult. I added a class to the ul called "tracks".

 $(".shufflebutton").click(function() {
        var trackCount = $(".tracks li").length;
        console.log('trackCount:' + trackCount);
         /* Pick random number between 1 and trackCount */
        var randomNum = Math.ceil(Math.random()*trackCount); 
        console.log("randomNum:" + randomNum);     
      });

Full code example here: http://jsfiddle.net/F8w8r/