Question

所以，我一直在寻找几天的互联网，但仍然没有得到任何答案。所以，我在这里:)。我有一个TreeView，我从Sitemap（Web.sitemap）填充XML，并充当网站上的菜单。我希望能够在单击其标题时切换菜单节点。这样，我可以摆脱+ - 复选框，使其看起来更整洁。到目前为止，我可以让他们切换。但是，只有在我通过首先单击与其关联的复选框预先填充节点之后。有没有人有任何想法我怎么能这样做？

这是我的TreeView div

       <div class="menu" style="width: auto; float:left; margin-top: 20px;"> 
            <asp:SiteMapDataSource ID="smdsMenu" runat="server" SiteMapProvider="MainMenuSiteMapProvider"/>
            <asp:TreeView ID="tvMenu" runat="server" DataSourceID="smdsMenu" ExpandDepth="1" ImageSet="Arrows" margin-top="0px">
                <LeafNodeStyle BackColor="Transparent" CssClass="tvMenuL2" />
                <HoverNodeStyle Font-Bold="True" BackColor="#1e8acb" ForeColor="Black" Font-Underline="False" />
                <ParentNodeStyle BackColor="#6E7E94" CssClass="tvMenuL1" Font-Bold="false" />
                <RootNodeStyle BackColor="#2c4566" CssClass="tvMenuL0" />
                <SelectedNodeStyle Font-Underline="True" ForeColor="#1e8acb" HorizontalPadding="0px" VerticalPadding="0px" />
            </asp:TreeView>
        </div>

这是我的页面加载处理程序

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            tvMenu.Attributes.Add("onmousedown", "return OnTreeMouseClick(event)");
        }
    }

这是我的Javascript

<script lang="javascript" type="text/javascript">
    function OnTreeMouseClick(evt) {
        var src = window.event != window.undefined ? window.event.srcElement : evt.target;
        var nodeClick = src.tagName.toLowerCase() == "span";
        if (nodeClick) {
            // Change tvMenu to ID of TreeView
            var tvDataName = "tvMenu" + "_Data";
            var tv = document.getElementById("tvMenu");
            var tvData = window[tv.id + "_Data"];
            var spanID = src.id;
            var selectNode = document.getElementById(spanID);
            var start = spanID.indexOf("tvMenu" + "t");
            var length = 7; // length of TreeView ID + 1 for the letter t
            var spanIndex = parseInt(spanID.substring(start + length));
            if (spanIndex != NaN) {
                var spanNode = "tvMenu" + "n" + spanIndex.toString();
                var spanChildren = spanNode + "Nodes";
                // Call toggle Node script
                TreeView_ToggleNode(
                    tvData,                                 // data
                    spanIndex,                              // index
                    document.getElementById(spanNode),      // node
                    '',                                     // lineType
                    document.getElementById(spanChildren)   // children
                    );
            }
        }
        return false;
    }
</script>

我知道我的Javascript没有填充节点。但是，我不知道如何在没有数据路径的情况下使用TreeView_PopulateNode，就像复选框一样。

<a id="tvMenun1" href="javascript:TreeView_PopulateNode(tvMenu_Data,1,document.getElementById('tvMenun1'),document.getElementById('tvMenut1'),null,' ','Overview','Home\\Overview','t','776cfb0b-fc9e-4ff1-8487-829a1162916d','tf')">
    <img src="/WebResource.axd?d=8Ig4CKxOyXBIduEK8UJR2BXEYzKQWBLDFGfU4Y_g95G2TuDmM3zzGZE7CoW0qe4bVdRWK9Vp8x2MnX9eQ6Z66hsxeeTNg2xk5-CpNTJuS3Q1&amp;t=636043022594211026" alt="Expand Overview" style="border-width:0;">
</a>

这是我代码中生成的HTML

<span class="tvMenu_0 tvMenuL1 tvMenu_3" title="Overview" id="tvMenut1" style="border-style:none;font-size:1em;">Overview</span>

对此的任何帮助都将非常感激。感谢。

Webforms - 在标题上展开动态创建的TreeNodes单击

0 个答案: