jQueryと外部HTMLﾌｧｲﾙのload､video tagの質問です｡
以下のようなScriptをHTML中に記述しました｡
この場合､loadしたHTMLに含まれるvideo tag "#id_video"の
endedを取得できず､video再生終了時の"ended!"を表示できません｡
このendedを取得する方法をご存知でしたら教えてください｡
よろしくお願いします｡
ちなみに"#id_video"のon clickは検出可能で､
"click!" を表示することはできています｡
また､このscriptと同じHTMLに記述されている
video tag"id_video2"からのendedは取得できているので
"ended2!"も表示できています｡
function load_movie(){
$('#load_area').load(html);
console.log("load!");
// $("#id_video").on("ended", function() {
$(document).on("ended","#id_video", function() {
console.log("ended!");
})
$(document).on("click","#id_video", function() {
console.log("click!");
})
$("#id_video2").on("ended", function() {
console.log("ended2!");
})
}
うｰん､HTML5の仕様書を斜め読みした限り明記されてないんですが､endedｲﾍﾞﾝﾄはﾊﾞﾌﾞﾘﾝｸﾞしないんじゃないでしょうか｡
浮上(bubble up)するものは特定のｲﾍﾞﾝﾄだけです｡浮上するｲﾍﾞﾝﾄはこのﾌﾟﾛﾊﾟﾃｨが true になっています｡なので､これを調べることにより､そのｲﾍﾞﾝﾄが浮上するものかどうかを知ることができます｡
event.bubbles - DOM | MDN
ということですから､
$("#id_video").on("ended", function(e) {
console.log(e.bubbles);
})
↑この結果がfalseなﾌﾞﾗｳｻﾞはｲﾍﾞﾝﾄﾊﾞﾌﾞﾘﾝｸﾞしない､つまりdocumentでendedｲﾍﾞﾝﾄが起きないので､ｲﾍﾞﾝﾄﾘｽﾅで拾えない､ということになるかと｡
ﾍﾞｽﾄｱﾝｻｰ