[原创][ActiveX]TreeView完全实例

当很多都在追求各式各样的目录tree的时候，我却搬出那个我觉得是功能和性能都最好的treeview，但就是不够美！


<object id=treeview1 width=50% height=50%
   classid="clsid:c74190b6-8589-11d1-b16a-00c0f0283628"
>
</object>

<script language = "javascript">
function init(){
with(treeview1){
 linestyle=1;
 dragmode=0;
 borderstyle=0;
 tooltiptext="[activex control]treeview 完全演示";
 var node=null;
 node = nodes.add(null,0,"r","root");
 //node.
 nodes.add("r",4,"p1","item1");
 nodes.add("r",4,"p2","item2");
 nodes.add("r",4,"p3","item0");
 nodes.add("p1", 4,"c1","child 2");
 nodes.add("p1", 4,"c2","child 1");
 nodes.add("c1", 4,"c3","child 3");
 nodes.add("c2", 4,"c4","10");
 nodes.add("c2", 4,"c5","01");
 nodes.add("c2", 4,"c6","03");
 nodes.add("c2", 4,"c7","02");
 }
}
init();

function sort(flag){
 for (var i=1;i<=treeview1.nodes.count;i++){
  treeview1.nodes(i).sorted=flag;
 
 }
}

function deletenode(){
 var iindex;
 iindex=treeview1.selecteditem.index;
 treeview1.nodes.remove(iindex);
}

function deletetree(){
 treeview1.nodes.clear();
}

function checknode(node){
 var iindex=0;
 with(treeview1){
  if (node.children>0){
   iindex=node.child.index;
  
   while (iindex!=(node.child.lastsibling.index)){
    nodes(iindex).checked=node.checked;
    if (nodes(iindex).children>0){
     checknode(nodes(iindex));
    }
    iindex=nodes(iindex).next.index;
   }
   iindex=node.child.lastsibling.index;
   nodes(iindex).checked=node.checked;
   if (nodes(iindex).children>0){
    checknode(nodes(iindex));
   }
  }
 }
}

function addnode(level,key,text){
//level:
// 0:第一条
// 1:最后条
// 2:下一条
// 3:上一条
// 4:子节点 
 var vkey;
 vkey=treeview1.selecteditem.key;
 treeview1.nodes.add(vkey,level,key,text); 
}

function addrootnode(key,text)
{
 treeview1.nodes.add(null,0,key,text);
}

</script>

<script for="treeview1"  language = "javascript" event="nodeclick(node)">
var str=""
str+="index:"+node.index+"\n";
str+="key:"+node.key+"\n";
str+="text:"+node.text+"\n";
myvalue.value=str; 
</script>

<script for="treeview1"  language = "javascript" event="dragdrop(control,x,y)">
//首先应该判断是不是node型的，可是javascript类型不好判断
alert(".");
</script>

<script for="treeview1"  language = "javascript" event="dblclick">
if (selecteditem.children<1){
 with(selecteditem){
  var str=""
  str+="index:"+index+"\n";
  str+="key:"+key+"\n";
  str+="text:"+text+"\n";
 }
 alert(str);
} 
</script>

<script for="treeview1"  language = "javascript" event="nodecheck(node)">
 checknode(node); 
</script>

<br>
<textarea rows="5" name="myvalue" cols = '16'></textarea>
<button onclick="sort(true)">排序</button>
<button onclick="deletenode()">删除当前节点</button>
<button onclick="deletetree();this.disabled=true;">删除整个树</button>
<button onclick="addrootnode('r1','root1');this.disabled=true;">添加根节点</button>
<button onclick="addnode(4,'d1','demo1');this.disabled=true;">添加子节点</button>
<button onclick="addnode(3,'d2','demo2');this.disabled=true;">添加同级节点，上面</button>
<button onclick="addnode(2,'d3','demo3');this.disabled=true;">添加同级节点，下面</button>
<input type=checkbox onclick="treeview1.checkboxes=!treeview1.checkboxes;">复选框

<p>
主要功能演示:<br>
 1.添加
 2.删除
 3.排序
 4.单击，双击事件
 5.复选框属性及事件的应用
</p>