2011-06-05 34 views
6

我想確定什麼是最有效的方式來加載視頻到用戶點擊使用jQuery。用戶點擊通過jQuery加載YouTube視頻的最有效方式是什麼?

爲了給出更多背景,我會在YouTube上看到大約30個剪輯,每個剪輯都在30-60秒之間,我想動態地將它們加載到頁面右側的div中,作爲用戶瀏覽左側的主題和潛在的視頻剪輯。

現在,我已經設置了這個HTML和jQuery。它的工作原理,但我很好奇,如果有一個更好的方法:

<div class="wrapper"> 
    <div class="details_left"> 
     <div class="cluster"> 
      <a href="#" id="johnk" class="vid_trigger"><div class="title">The importance of demonstrating intellectual curiosity</div></a> 
      <div class="role">John K: Summer Consultant, BCG</div> 
      <div class="summary">Discussion on how curiousity is important to show in interviews because it leads to better answers on the job</div> 
     </div> 
    </div> 
    <div class="details_right" id="video_container"> 
     video 
    </div> 
</div> 

而jQuery的:

$('#johnk').click(function(){ 
    $('#video_container').html('<iframe width="425" height="349" src="http://www.youtube.com/embed/bMvRdr-mUOU?rel=0" frameborder="0" allowfullscreen </iframe>'); 
}) 

爲了減少手我正在考慮創建一個關聯的每個視頻編碼。點擊()具有ids->嵌入代碼的數組。有沒有更好的方法來更高效地完成相同的功能?

在此先感謝您的任何見解!

+0

從ID嵌入代碼地圖是爲了避免重複代碼的好方法。 [DRY](http://en.wikipedia.org/wiki/Don%27t_repeat_yourself)永遠是件好事。 – 2011-06-05 04:14:44

+0

@mattball地圖對我來說也是最有意義的;然而,我剛剛創建的測試哈希(數組)不起作用。例如,var vid_map ['johnk'] ='