您的位置：首页 > Web前端 > JavaScript

ExtJS专题（十一）:lTree的Treepanel使用

2010-03-11 18:41 363 查看

最近学习extjs发现了一个问题，extjs是一个JavaScript的框架，属于前端页面上的，所有完全可以和后天的语言分离，大家在extjs的官方例子中可以看到都是html的格式。也就是说和后台结合的话也是按照某种方式传输数据，干什么又加上各种语言的各种框架。简单问题复杂化。
现在通过例子说明一下。

.net代码

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Virgo_S</title>

<link rel="stylesheet" type="text/css" href="extjs/ext-all.css" />

<script type="text/javascript" src="extjs/ext-base.js"></script>

<script type="text/javascript" src="extjs/ext-all.js"></script>

<script type="text/javascript" src="extjs/ext-lang-zh_CN.js"></script>

<script type="text/javascript">

Ext.onReady(function(){

//定义树的跟节点

var root=new Ext.tree.TreeNode({

id:"root",//根节点id

text:"我是树根"

});

//定义树节点

var c1=new Ext.tree.TreeNode({

id:'c1',//子结点id

text:'大儿子'

});

var c2=new Ext.tree.TreeNode({

id:'c2',

text:'小儿子'

});

var c22=new Ext.tree.TreeNode({

id:'c22',

text:'大孙子'

});

root.appendChild(c1);//为根节点增加子结点c1

root.appendChild(c2);//为c1增加子节点c2，相信你已经找到规律了吧^_^

c1.appendChild(c22);//为c1增加子节点c22

//生成树形面板

var tree=new Ext.tree.TreePanel({

renderTo:"tree",

root:root,//定位到根节点

animate:true,//开启动画效果

enableDD:false,//不允许子节点拖动

border:false,//没有边框

rootVisible:false//设为false将隐藏根节点，很多情况下，我们选择隐藏根节点增加美观性

});

});

</script>

</head>

<body>

<div id="tree" style="height: 500px; width: 500px;"></div>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航