1

我正在尝试在 Visual Studio 2012 Express 中使用 videojs.com 的视频播放器播放视频。

我的网络表单基于母版页。以下是母版页的代码

<head runat="server">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title><%: Page.Title %> - My ASP.NET Application</title>

<asp:PlaceHolder runat="server">
    <%: Scripts.Render("~/bundles/modernizr") %>
</asp:PlaceHolder>
<webopt:BundleReference runat="server" Path="~/Content/css" />
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />

<link href="http://vjs.zencdn.net/4.2/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/4.2/video.js"></script>

 <asp:ContentPlaceHolder ID="HeadContent" runat="server">
 <asp:ScriptManager runat="server">
        <Scripts>

            <%--Framework Scripts--%>
            <asp:ScriptReference Name="MsAjaxBundle" />
            <asp:ScriptReference Name="jquery" />
            <asp:ScriptReference Name="bootstrap" />
            <asp:ScriptReference Name="WebForms.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebForms.js" />
            <asp:ScriptReference Name="WebUIValidation.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebUIValidation.js" />
            <asp:ScriptReference Name="MenuStandards.js" Assembly="System.Web" Path="~/Scripts/WebForms/MenuStandards.js" />
            <asp:ScriptReference Name="GridView.js" Assembly="System.Web" Path="~/Scripts/WebForms/GridView.js" />
            <asp:ScriptReference Name="DetailsView.js" Assembly="System.Web" Path="~/Scripts/WebForms/DetailsView.js" />
            <asp:ScriptReference Name="TreeView.js" Assembly="System.Web" Path="~/Scripts/WebForms/TreeView.js" />
            <asp:ScriptReference Name="WebParts.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebParts.js" />
            <asp:ScriptReference Name="Focus.js" Assembly="System.Web" Path="~/Scripts/WebForms/Focus.js" />
            <asp:ScriptReference Name="WebFormsBundle" />
            <%--Site Scripts--%>
        </Scripts>
    </asp:ScriptManager>

以下代码是需要播放视频的页面

<script  type="text/javascript">videojs('my_video_1').ready(function () {
var player = this;
player.play();

this.on('loadeddata', function () {
    player.currentTime(10);
});
});</script>

<video id="my_video_1" class="video-js vjs-default-skin "
  poster="img/message.png"
  controls preload="auto" width="640" height="360" data-setup='{}'>
<source src="Videos/Presentation.mp4" type='video/mp4' />

</video>

当我运行调试器时,Presentation.aspx 页面运行并且我收到以下错误

http://vjs.zencdn.net/4.2/video.js中第 1 行第 511 列未处理的异常

0x800a139e - JavaScript 运行时错误:抛出异常但未捕获

如果有这个异常的处理程序,程序可以安全地继续。我正在参考https://github.com/videojs/video.js/blob/v4.3.0/docs/guides/api.md的功能,但我被困在第一步。

throw new TypeError("提供的元素或 ID 无效。(videojs)");

谢谢您的帮助

4

1 回答 1

0

脚本标签需要在页面中视频标签之后,否则脚本运行时视频标签不存在。

也不要在手动调用 videojs() 来初始化视频的同时使用 data-setup 属性。他们完成同样的事情,可能会导致意想不到的结果。

于 2013-11-07T21:59:19.503 回答