Html5 Audio restart playback in iOS Safari

by | Sep 13, 2012 | Programming

When using html5 audio and Apple’s safari browser on iOS there is a problem that occurs when you try to set the audio’s time.

Html5 audio DOM object has an attribute called currentTime. This unfortunately isn’t available in iOS safari. This makes it difficult if you want to start the audio from the beginning.

An example code like this:

if($('#audio_' + id)[0].currentTime != undefined)
{
	$('#audio_' + id)[0].currentTime = 0;
}

will throw an exception.

There is an easy way around this problem and that is by removing the audio element from the DOM and then re-adding it.

Here is my code:

var audio = $('#audio_' + id).clone();
var parent = $('#audio_' + id).parent();
$('#audio_' + id).remove();

Post in the comments below if this has helped you in developing html5 audio in safari. Any questions are also welcome.