单击一个 div 隐藏 div 并替换另一个

Question

我正在尝试创建一个视频播放器，如果您单击图像，它会将图像交换为 youtube 视频。代码运行良好，直到我想在顶部放置一个 div 作为播放器按钮。

现在，当然，该按钮挡住了路，无法识别点击事件。我怎么知道当您单击“播放” div 时它会隐藏该 div 并将另一个 div 图像交换为 youtube 视频。

代码如下：

$(document).ready(function(){
    $('#play').click(function(){
        $('#play').hide();
        $('img').function () {
            video = '<iframe src="' + $(this).attr('data-video') + '" width="100%" height="100%" frameborder="0"></iframe>';
            $(this).replaceWith(video);
    });
});

我对 jQuery 还是很陌生，并不完全了解布局和函数调用是如何工作的。您的洞察力将真的很有帮助！

谢谢:)

Answer 1

给你：

http://jsfiddle.net/tvyfxey6/6/

 $('#play').on('click', function(evt) {
         alert('click'); 
     $('#play').hide();
      $('#img').hide();
     $('#video').html('<iframe src="' + $('#video').attr('data-video') + '" width="100%" height="100%" frameborder="0"></iframe>');

 });