Javascript Jquery Fancybox无法与youtube一起使用

首先，我不擅长javascript和jquery。我有如下视频URL：

我正在使用jinja2进行模板制作（这段代码包含一些用于fancybox的JS和图像）。 我的问题只是youtube视频

我写了这段代码（编辑）：

---

您是否尝试过将自定义初始化代码包装到

.ready（）

方法中？您是用一个选择器（

.fancybox

）完成的，而不是用其他选择器。对不起，我不明白，请您解释一下。编辑：好的，我试试。你是说像这样吗？

<!-- Add jQuery library -->
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    <!-- Add mousewheel plugin (this is optional) -->
    <script type="text/javascript" src="{{ url_for('static', filename='js/fancybox/lib/jquery.mousewheel-3.0.6.pack.js') }}"></script>
    <!-- Add fancyBox -->
    <link rel="stylesheet" href="{{ url_for('static', filename='js/fancybox/source/jquery.fancybox.css') }}" type="text/css" media="screen" />
    <script type="text/javascript" src="{{ url_for('static', filename='js/fancybox/source/jquery.fancybox.pack.js') }}"></script>   
    <!-- Optionally add helpers - button, thumbnail and/or media -->
    <link rel="stylesheet" href="{{ url_for('static', filename='js/fancybox/source/helpers/jquery.fancybox-buttons.css') }}" type="text/css" media="screen" />
    <script type="text/javascript" src="{{ url_for('static', filename='js/fancybox/source/helpers/jquery.fancybox-buttons.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static', filename='js/fancybox/source/helpers/jquery.fancybox-media.js') }}"></script>
    <link rel="stylesheet" href="{{ url_for('static', filename='js/fancybox/source/helpers/jquery.fancybox-thumbs.css') }}" type="text/css" media="screen" />
    <script type="text/javascript" src="{{ url_for('static', filename='js/fancybox/source/helpers/jquery.fancybox-thumbs.js') }}"></script> 
    <script type="text/javascript">$(document).ready(function() { $(".fancybox").fancybox();});</script>
    <script type="text/javascript">$("a.fancytitle").fancybox({'titlePosition': 'inside','titleFormat': function() {return $('.fancytitle').attr('title');}});</script>
    <script type="text/javascript">
$('.video').on('click', function(event) {
    event.preventDefault();
    $.fancybox({
        'type' : 'iframe',        
        'href' : this.href,
        'overlayShow' : true,
        'centerOnScroll' : true,
        'speedIn' : 100,
        'speedOut' : 50,
        'width' : 640,
        'height' : 480
    });
});
    </script>

{% if items.trailers %}
                <a href="{{items.trailers.ytb_url}}" id="video" class="video">
                <img class="trailer" src="{{url_for('static', filename='img/video.png')}}" title="{{items.title}}-{{items.trailers.ytb_title}}"/>
                </a>
{% endif %}

(function ($) {
  $(document).ready(function(){
    $('a[href*=youtube]').each(function () {
        var thisHref = this.href
        $(this).fancybox({
            "padding": 0,
            "type": 'iframe',
            "href" : thisHref+"&wmode=opaque;autoplay=1"
        });
    }); 
  }); 
})(jQuery);