Question

我在HTML和Javascript中设置了一个交互式视频播放列表，可以在与播放列表相同的页面上的HTML5视频播放器窗口中播放视频。它工作正常。现在我被告知必须在ASP树视图中设置播放列表，但我不能使用ASP代码来使用Javascript。如何更改代码以使其工作？代码如下：

使用Javascript：

$(function () {
    $("#TreeView1 TreeNode").on("click", function () {
        $("#videoarea").attr({
            "src": $(this).attr("NavigateUrl"),
            "poster": "",
            "autoplay": "autoplay"
        })
    })
    $("#videoarea").attr({
        "src": $("#TreeView1 TreeNode").eq(0).attr(NavigateUrl"),
        "poster": $("#TreeView1 TreeNode").eq(0).attr("moviesposter")
    })
})

ASPX ::

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ViewVideos.aspx.cs" Inherits="VideoWebApp.ViewVideos" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

    <link rel="stylesheet" type="text/css" href="videoapp.css" />

  <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>

      <script type="text/javascript" src="VideoApp.js"></script> 

    <title>Video Library</title>

</head>

<body>

 <%--   <div class="wrap">--%>

        <form id="form1" runat="server">

    <div class="top">
        <img src="art/tpmtrans.png" alt="TPM" class="logo"/>
    </div>

    <div class="left">
        <h3>Instructional Videos</h3>
        <br/>

        <asp:TreeView clientidmode="Static" ID="TreeView1" runat="server">

    <Nodes> 
        <asp:TreeNode Text="Movies">
            <asp:TreeNode Text="Movie 1" NavigateUrl="~/videos/Movie1.webm" Target="_blank"/>
            <asp:TreeNode Text="Movie 2" NavigateUrl="~/videos/Movie2.webm" Target="_blank"/>
            <asp:TreeNode Text="Movie 3" NavigateUrl="~/Movie3.aspx" Target="_blank"/>
            <asp:TreeNode Text="Movie 4" NavigateUrl="~/Movie4.aspx" Target="_blank"/>
        </asp:TreeNode>
    </Nodes>
</asp:TreeView>

    </div>

    <div class="main">
            <div>
                <p>

                    <video id="videoarea" controls="controls" poster="ART/Welcome-Poster.png " src=""></video>


                </p>

            </div>
        </form>
    </div>

</body>

</html>

如何让Javascript与ASP treeview一起使用？

0 个答案: