如何解决YouTube:点击按钮即可播放YouTube视频
我的页面包含嵌入iframe的YouTube,并且使其无法点击,我想仅在单击“播放”按钮时才播放视频,我在这里和网络上进行了搜索并对其进行了测试,但它们无法正常工作:>
<div class="col-md-6">
<div class='py-3' ><?php echo $course_name?></div>
<div class="embed-responsive embed-responsive-16by9 px-6 py-6" style='pointer-events: none'>
<iframe id='video'
src="<?php echo $course_video?>"> <!--the Youtube livk is come from server as : https://www.youtube.com/embed/xxxxxxxxxxxx -->
</iframe>
</div>
<div class='row w-100 justify-content-center mt-3'><button class='btn bg-primary' id='play_video'><i class=" fa fa-play"></i></button></div>
</div>
和我的JavaScript代码:
$(document).ready(function(){
$('#play_video').on('click',function(ev) {
$("#video")[0].src += "&autoplay=1";
ev.preventDefault();
})
})
我该怎么办?
解决方法
您忘记在JavaScript中添加分号:
$(document).ready(function() {
$('#play-video').on('click',function(ev) {
$("#video")[0].src += "&autoplay=1";
ev.preventDefault();
});
});
您还忘记了单击(<a id="play-video" href="#">Play Video</a><br />
)所需的链接到HTML文件,并从代码中删除了style='pointer-events: none'
:
<div class="col-md-6">
<div class='py-3' ><?php echo $course_name?></div>
<div class="embed-responsive embed-responsive-16by9 px-6 py-6">
<a id="play-video" href="#">Play Video</a><br />
<iframe id='video' src="<?php echo $course_video?>">
</iframe>
</div>
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。