HTML5の自動再生属性をターゲットにする方法モーダル内のビデオ要素

Question

モーダルウィンドウ内にHTML 5ビデオ要素があります。今私は、モーダルが開かれ、ビデオ要素が自動再生してビデオを再生するかどうかを確認する必要があります。ビデオに属性autoplayがない場合は、ビデオを再生しないでください。

http://codepen.io/hennysmafter/pen/YqmLKR

ください上記Codepenでの完全なコードを見てください。

<video id="somevid" controls autoplay loop> 
<source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4"> 
<source src="http://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg"> 
Your browser does not support HTML5 video. 
</video> 

だから、autoplayをターゲットにし、それがid: popup1 Codepenを参照してください内のvideo要素をターゲットとすべき映像からIDフィールドを使用することはできません必要があります！

$(document).ready(function(){ 
    $('a[data-modal-id]').click(function(e) { 
     e.preventDefault();  
      if ($('.modal-box.opened').find('video').attr(autoplay) == true) { 
       console.log('CLICK: ModalBox if Video Autoplay is true.'); 
      } 
    });    
}); 

問題が上記のコードです。今私はこれが私にただテストのためのログを与えることを知っている。

このコードは、エラーを与える：キャッチされないにReferenceError：自動再生が助けるため、事前に

ありがとう

が定義されていません。私はあなたが自動再生の前後に引用符を忘れてしまったと思います

Answer 1

あなたは、文字列"autoplay"ではなく、変数autoplayを使用している、これにあなたのコードをアップデートしてみてください：

は

if ($('.modal-box.opened').find('video').attr('autoplay') == true) { 
    console.log('CLICK: ModalBox if Video Autoplay is true.'); 
} 

UPDATE：

が代わりにこれを試してみてください：

if (($('.modal-box.opened').find('video').attr('autoplay') === 'autoplay')) { 
    $('.modal-box.opened').find('video').get(0).play(); 
} 

Answer 2

は、

if ($('.modal-box.opened').find('video').attr("autoplay") == true) 

のようにまた、それはおそらく、自動再生が財産

EDITであることを知って、小道具（「自動再生」）を使用する必要があります。自動起動あなたがもう一度ビデオを回復しなければならないので、

$(this).get(0)は、目的の要素を返しません：

var video = $('.modal-box.opened').find('video'); 
if (video.prop("autoplay")) { 
    video.get(0).play(); 
} 

Answer 3

この例を確認してください 私はそれが役に立ちそうです

[1]: https://jsfiddle.net/NbE9d/570/

Answer 4

自動再生が設定されているかどうかを確認するには、次の

var $video = $('.modal-box.opened').find('video'); 

if(typeof $video.attr('autoplay') === "string"){ 
    $video.get(0).play(); 
} 

または自動再生が設定されていないかどうかを確認するために：私を助けるため

if(typeof $video.attr('autoplay') === "undefined"){ 
    //Logic here 
}