HTML5 Audio and jQuery

问题

I am trying to use a button to start a track in an HTML5 audio tag using jQuery, but I keep getting an error.

var song = $('#audio');

$('#play').click(function() {
song.play();
});

When I use document.getElementById('audio'), it works, but when using the jQuery selector I get the following error:

Uncaught TypeError: Object [object Object] has no method 'play'

Thanks for any help.

回答1:

Try getting the native DOM element as jQuery knows nothing about .play method on the wrapped array returned by the $('#audio') selector:

song.get(0).play();

回答2:

You can also write it like song.trigger('play');. That will allow you to use the $('#audio'); selector.

回答3:

Instead of .get() just use object notation:

var song = $('#audio');

$('#play').click(function() {
    song[0].play();
});

It's less to type :)

来源：https://stackoverflow.com/questions/6588934/html5-audio-and-jquery