Asp.net Treeview 客户端选中效果实现 (初级)
2010-02-02 12:22
489 查看
Asp.net Treeview 客户端选中效果实现
最近将asp.net默认自带的treeview控件,做成一个导航树,导向其它的几个站点,所以这样写TreeNode tn = new TreeNode();
tn.Text = “新浪网”;
tn.NavigateUrl = "http://www.sina.com.cn";
tn.Target = "mainFr";
但是发现一个问题,所选中的树节点,不会选中效果
导航树 | 内嵌一个iframe name=” mainFr” 页 |
<asp:TreeView ID="TreeView1" runat="server" ShowLines="True"> <SelectedNodeStyle BackColor="White" VerticalPadding="1px" BorderColor="#888888" BorderStyle="Solid" BorderWidth="1px" HorizontalPadding="3px"></SelectedNodeStyle> <NodeStyle VerticalPadding="2px" Font-Names="Verdana" Font-Size="8pt" NodeSpacing="1px" HorizontalPadding="5px" ForeColor="Black"></NodeStyle> <HoverNodeStyle BackColor="#CCCCCC" BorderColor="#888888" BorderStyle="Solid" BorderWidth="1px" Font-Underline="True"></HoverNodeStyle> </asp:TreeView> |
<table cellpadding="0" cellspacing="0" style="border-width:0;"> <tr style="height:1px;"> <td></td> </tr><tr> <td><img src="/pms2/WebResource.axd?d=NcGWj-qNqtl9MKe7hlPi6oqQI3MC5mSq6_3UjP0SAHw1&t=633911118017187500" alt="" /></td><td class="TreeView1_2" onmouseover="TreeView_HoverNode(TreeView1_Data, this)" onmouseout="TreeView_UnhoverNode(this)" style="white-space:nowrap;"><a class="TreeView1_0 TreeView1_1" href="http://www.sina.com.cn" target="mainFr" onclick="javascript:TreeView_SelectNode(TreeView1_Data, this,'TreeView1t3');" id="TreeView1t3">3</a></td> </tr><tr style="height:1px;"> <td></td> </tr> </table> |
代码如下:
public class TreeNodeEx : TreeNode { protected override void RenderPreText(HtmlTextWriter writer) { writer.AddAttribute("onclick", " tn_Click(this);"); base.RenderPreText(writer); } } |
TreeNodeEx tn = new TreeNodeEx(); tn.Text = “新浪网”; tn.NavigateUrl = "http://www.sina.com.cn"; tn.Target = "mainFr"; |
tn_Click 函数
function tn_Click(obj) { var ds = document.getElementById("TreeView1").getElementsByTagName("a"); for(var i=0;i<ds.length;i++) { if(ds[i].className!="" && ds[i]!=obj) { //普通状态样式 ds[i].className="TreeView1_1"; //alert(ds[i].className); } else { //选中的样式 obj.className = "TreeView1_1 TreeView1_5"; } } } |
相关文章推荐
- 用JQuery实现对ASP.NET TreeView控件的级连选中
- Asp.Net TreeView实现父子节点联动效果
- ASP.NET 2.0实现自带TreeView的客户端连带选择
- ASP.NET 2.0 中 Treeview 的Checkboxes 选中根 枝叶全选中的实现方法(转)
- asp.net 全部选中与取消操作,选中后的删除(ajax)实现无刷新效果
- [翻译]使用ASP.NET AJAX实现幻灯片效果
- 在 ASP.NET 网页中不经过回发而以编程方式实现客户端回调
- ASP.NET 用MultiView和View实现选项卡效果
- ASP.NET动态加载不同CSS,实现切换皮肤效果
- ASP.NET WebForm Form表单如何实现MVC那种“自动装配”效果呢?
- ASP.NET MVC如何实现自定义验证(服务端验证+客户端验证)
- 用js脚本控制asp.net下treeview的NodeCheck的实现代码
- ASP.NET 2.0客户端回调的实现分析
- ASP.NET 2.0中实现客户端回调的简化版
- ASP.NET 用MultiView和View实现选项卡效果
- 【转】Asp.net1.1实现仿2.0的MasterPage效果
- 使用 ExtJS 实现 ASP.NET MVC 2 客户端验证
- ASP.NET 2.0客户端回调的实现分析
- Asp.net"页面加载中"效果实现