2015-02-05 41 views
2

i am working on MVC5 video website with embedded jwplayer, the "file" value is assigned dynamically from @viewBag.VideoUrl to jwplayer and video plays with no problem...All videos from database loaded on the episodeList view, now for multiple videos or video_playlist, i want to play video which i select by clicking as can be seen from snapshot at the end..i been reading about doing the playlist technique via RSS feed,,,Is it the only way to create PlayList Rss feed???如何發揮jwplayer視頻時調用的onclick功能....播放列表

播放器腳本

<div id="mediaplayer"></div> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 
     jwplayer('mediaplayer').setup({ 
      'file': 'rtmp://872083564.r.cdnsun.net/872083564/_definst_/mp4:872083564/ 
      @ViewBag.VideoUrl', 
      'autostart': true, 
      'width': 320, 
      'height': 240, 
      rtmp: { 
       securetoken: "fsdf5sdfsdf43f5" 
      }, 
     }); 
    }); 
    </script> 

查看代碼,用於顯示所有視頻在表3列, foreach循環來執行每個項目,我想嘗試「onclick for href」但不知道如何去做,沒有別的

const int NumberOfColumns = 3; int skip = 0; var items = Model.Skip(skip).Take(NumberOfColumns); 
while (items.Count() > 0) { 
<tr> 
    @foreach (var item in items) { 
    <td width="450"> 
    <table class="thumbmain"> 
    <tr> 
    <td> 
    <a href="" /> 
    <img src="@Url.Content(item.PosterUrl)" width="120" height="120" class="imageclass" 
     onclick="someAction" /> 
    </td> 
    </tr> 
    <tr> 
    <td style="text-align: center; font-weight: bold; color: Teal"> 
    @item.Title 
    </td> 
    </tr> 
    </table> 
    </td> 
    } 
</tr> 
skip += NumberOfColumns; items = Model.Skip(skip).Take(NumberOfColumns); } } </table> 
</div> </div> </div> 

控制器動作

public ActionResult EpisodeList(Guid? id) 
{ 
    IQueryable<VideoEpisodeDM> episodesdm = db.VideoEpisode 
     .Where(ve => ve.VideoId == id); 

    string video; 

    foreach (var item in episodesdm) 
    { 
     video = item.Title; 
     ViewBag.VideoUrl = item.VideoUrl; 
    } 


    return View(episodesdm.ToList()); 
} 

輸出:

enter image description here

i want to play videos accordingly like if i click "downTo" it should load/play "downTo" video, if "finaltick" then finaltick url should load in file''....if there is a way please help or reference will be appreciated...Thanks for your time

回答

5

你的意思是這樣?

http://support.jwplayer.com/customer/portal/articles/1439570-example-loading-new-playlists

發生在你想要的位置下面的嵌入代碼的球員出現:

<div id="myElement"></div> 

<script> 
    jwplayer("myElement").setup({ 
    image: "/uploads/myPoster.jpg", 
    file: "/uploads/myVideo.mp4", 
    title: "My Cool Trailer" 
    }); 
</script> 

其次,添加JavaScript來實現負載行爲:

<script> 
    function loadVideo(myFile,myImage) { 
    jwplayer().load([{ 
     file: myFile, 
     image: myImage 
    }]); 
    jwplayer().play(); 
    }; 
</script> 

末,添加一些HTML,用正確的文件和圖像調用此功能:

<li><a href="javascript:loadVideo('file1.mp4','image1.jpg')">Video 1</a></li> 
<li><a href="javascript:loadVideo('file2.mp4','image2.jpg')">Video 2</a></li> 
<li><a href="javascript:loadVideo('file3.mp4','image3.jpg')">Video 3</a></li> 
+1

謝謝你這麼多Ethan ...這樣,但我將不得不動態傳遞文件和圖像地址...我要upvote這個有用的答案..兌換 – 2015-02-06 05:05:45

+2

沒問題,任何時間! =) – emaxsaun 2015-02-06 15:57:18

相關問題