2011-07-05 16 views
25

jQueryを使用してHTML5オーディオタグ内のトラックを開始するためにボタンを使用しようとしていますが、エラーが発生し続けます。HTML5オーディオとjQuery

var song = $('#audio'); 

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

jQueryのセレクタを使用する場合、私は、それが動作する、のdocument.getElementById(「オーディオ」)を使用するが、私は次のエラーを取得:

捕捉されない例外TypeErrorを:オブジェクト[オブジェクトのオブジェクト] '方法はありません再生 '

ありがとうございました。

答えて

56

はjQueryの$('#audio')セレクタによって返さ包まれた配列には何もについて.play方法を知っていないとネイティブDOM要素を取得してみてください。

song.get(0).play(); 
+3

:)を入力して少ないのですが?あなたは簡単な説明をしていただけますか、私は理解しています。ありがとう!! – user699242

+7

@ user699242、 '$( '.. some selector ..')'を使用すると、セレクタに一致する実際のDOMオブジェクトの配列が返されます。 .playメソッドは、実際のネイティブDOM要素で呼び出す必要があるネイティブHTML5メソッドです。したがって、jQueryセレクタによって返される配列からこのネイティブDOM要素をフェッチする必要があります。 idセレクタ( '#audio')を使用しているので、このセレクタに一致するDOM内に1つの要素があると仮定して、安全に' .get(0) 'を使ってフェッチできます。だから、基本的に '$(...)'を使うと結果にjQuery関数しか呼び出せず、 'play'は –

+0

ではありません。しかし、.get(0).tagNameを使用すると、未定義のエラーが報告されるのはなぜですか? – panda

13

あなたはまた、song.trigger('play');ようにそれを書くことができます。これにより、$('#audio');セレクタを使用することができます。

3

代わりに.getの()単にオブジェクトの表記法を使用します。

var song = $('#audio'); 

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

それは働いていた...なぜ

関連する問題