php - How to play multiple sound files on one Web Page? (on click best practice) - Stack Overflow

admin管理员组

文章数量:1415111

I have a page where there is a list of vocabularies. I have a TTS for each vocabulary. The current approach that I am using is to include an mp3 flash player for each vocabulary. This creates delay to load all the flash because there can be more than 10 vocabularies in one page.

another problem is that the mp3 of the tts file has to be created on the page load, this also gives delay to the loading time.

Some alternative approach in my mind is to:

• include only one flash player.
• load and play the file on click to reduce page load for tts file creation.

So my question is,

Is there any javascript or jquery plugin that can do either of the 2 other approaches?

thank you

I have a page where there is a list of vocabularies. I have a TTS for each vocabulary. The current approach that I am using is to include an mp3 flash player for each vocabulary. This creates delay to load all the flash because there can be more than 10 vocabularies in one page.

another problem is that the mp3 of the tts file has to be created on the page load, this also gives delay to the loading time.

Some alternative approach in my mind is to:

• include only one flash player.
• load and play the file on click to reduce page load for tts file creation.

So my question is,

Is there any javascript or jquery plugin that can do either of the 2 other approaches?

thank you

• php
• javascript
• jquery
• audio
• text-to-speech

Share Improve this question Follow edited Jan 1, 2012 at 21:18 Charles 51.5k1313 gold badges106106 silver badges144144 bronze badges asked Aug 26, 2011 at 0:05 bbnnbbnn 3,6121010 gold badges5151 silver badges7070 bronze badges 1

• Have you already considered SoundManager ? it's a Javascript to Flash API which is simple to use. – aziz punjani Commented Aug 26, 2011 at 14:17

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

You can use the <audio> tag (HTML5) and you can control it when to load the files.
It is supported in most of the browsers like Google Chrome, Firefox, Opera...

It has two ways to set the link:

Way 1

<audio src="YOUR FILE LINK HERE">
    <embed> <!--FALLBACK HERE (FLASH PLAYER FOR IE)--> </embed>
</audio>

Way 2

<audio>
    <source src="YOUR FILE LINK HERE (MP3)" type="audio/ogg" />
    <source src="YOUR OTHER FILE LINK HERE (OGG)" type="audio/mp3" />
    <embed> <!--FALLBACK HERE (FLASH PLAYER FOR IE)--> </embed>
</audio>

---

Attributes

• Put controls="controls" if you want it to display the audio player.
• Put loop="loop" if you want it to loop the audio.
• Put autoplay="autoplay" if you want it to play the audio by itself.
• Put preload="preload" if you want it to preload it.

---

JavaScript Controlling

You can also control it using JavaScript.

To play it: document.getElementById("YOUR AUDIO TAG").play()
To pause it: document.getElementById("YOUR AUDIO TAG").pause()

---

Read more

• http://w3schools./html5/tag_audio.asp

本文标签： phpHow to play multiple sound files on one Web Page (on click best practice)Stack Overflow