Question

私はmp4ビデオのクリックで私のHTMLページにYouTubeビデオを埋め込もうとしています。これが可能かどうか疑問に思っていますか？

以下のコードをコピーしましたが、動作しません。

$(document).ready(function() { 
 
    $("#video1").on('click', function() { 
 
    var video = '<iframe width="100%" height="auto" src="' + $(this).attr('data-video') + '"frameborder="0" allowfullscreen></iframe>'; 
 
    $(this).replaceWith(video); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="embed-container"> 
 
    <video autoplay muted loop id="play" preload="auto"> 
 
    <source id="video1" src="/media/wysiwyg/cms/halloween/2017/desktop/halloween.mp4" type='video/mp4' data-video="https://www.youtube.com/embed/KJ2dyKGLRMo?autoplay=1"> 
 
    <source id="video1" src="/media/wysiwyg/cms/halloween/2017/desktop/halloween.webm" type='video/webm' data-video="https://www.youtube.com/embed/KJ2dyKGLRMo?autoplay=1"> 
 
    </video> 
 
</div>

P.S.私は今使ったことのないこのyoutubeビデオに信用できません。現在のところ例として使っています。

誰でも助けてくれますか？

Answer 1

私は気にしませんでした！

は私の埋め込みコンテナ

 <div id="video1" class="embed-container" data-video="https://www.youtube.com"> 
      <video autoplay muted loop id="play" preload="auto"> 
      <source src="/media/wysiwyg/cms/halloween/2017/desktop/halloween.mp4" type='video/mp4'> 
      <source src="/media/wysiwyg/cms/halloween/2017/desktop/halloween.webm" type='video/webm'> 
      </video> 
     </div> 

と同じクラスだったのdivにIDを追加しました