Javascript 用 YouTube 视频替换 IMG - 自动播放无法正常工作

Question

我有一个图像，当您单击它时，它会被隐藏并显示 YouTube 视频。

我希望在您点击图像时播放视频，因此我在 YT 链接上设置了一个参数，以便它自动播放，并且在除 Google Chrome 之外的所有测试浏览器中都可以正常工作。

关于为什么 Chrome 在我点击图像之前就自动播放视频有什么想法吗？

 <div id="youtube" style="display:none;">
 <iframe width="940" height="520" src="http://www.youtube.com/embed/kr-oMG6EYSs?rel=0&showinfo=0&autoplay=1" wmode="transparent" frameborder="0" allowfullscreen></iframe>
 </div>


 <img src="images/slider_worklife_top.jpg" width="942" height="521" id="imageID" />
 <script type="text/javascript">
 $('#imageID').click(function() {
 $('#youtube').show();
 $('#imageID').hide();
 });
 </script>

Answer 1

尝试用 $(function(){/* CODE */} 包装你的 JS 代码

如果没有帮助，请尝试不同的方法，不要浪费时间:) :

<div id="youtube" style="display:none;">
   <iframe width="940" height="520" src="" wmode="transparent" frameborder="0" allowfullscreen></iframe>
 </div>

<img src="images/slider_worklife_top.jpg" width="942" height="521" id="imageID" />
<script type="text/javascript">
$(function(){
  $('#imageID').click(function() {
    $('#youtube').show().find("iframe").attr("src","http://www.youtube.com/embed/kr-oMG6EYSs?rel=0&showinfo=0&autoplay=1");
    $('#imageID').hide();
  });
});
</script>