在Fancybox iframe中使用自定義HTML與YouTube視頻

Question

我試圖用Fancybox打開YouTube視頻，但在Fancybox窗口中也有一些額外的HTML。因此，最終目標是讓視頻從YouTube上拉下來，然後在下面放一些文字，並從我的網站上獲取更多按鈕。我不想嵌入視頻。

我想過把視頻網址作爲一個變量傳遞，但我覺得應該有一個更簡單的方法。我無法在fancybox頁面上解析網址。

<script> 
$(document).ready(function() { 
    $("a.youtube").click(function() { 
     var vidLink = $(this).attr("rel"); 
     $.fancybox({ 
      'href' : 'player.html?page=' + vidLink, 
      'type' : 'iframe' 
     }); 
    }); 
}); 
</script> 

<a class="youtube" href="#" rel="http://www.youtube.com/watch?v=rvAK5crfRLc">The Video</a> 

然後在player.html

<script> 
    function show_video() { 
     var newVid = urlParams["vidLink"]; 
     document.getElementById("vidPlayer").setAttribute('src', newVid); 
    } 
</script> 

<iframe id="vidPlayer" src="" width="400" height="225" frameborder="0"></iframe> 
<h3><a href="#">Learn More</a></h3> 

Answer 1

player.html將永遠無法抓住一個變量進行查詢字符串。你將不得不使用類似PHP的東西來獲取變量。

您也可以使用javascript並通過location.search對象讀取所有查詢字符串參數。

See Here