dhtmlxtree学习笔记二(常用方法)

原创 2013年12月04日 10:27:49

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Easy skinable design</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="title" content="Samples" />
<meta name="keywords" content="" />
<meta name="description" content="" />


</head>
<body>


	<link rel="STYLESHEET" type="text/css"
		href="dhtmlxtree/dhtmlxtree.css">
		<script src="dhtmlxtree/dhtmlxcommon.js"></script>
		<script src="dhtmlxtree/dhtmlxtree.js"></script>
		<!-- 如果是使用json格式就必须引入 dhtmlxtree_json.js文件-->
		<script src="dhtmlxtree/dhtmlxtree_json.js"></script>

		<div id="treeboxbox_tree"
			style="width: 250px; height: 218px; background-color: #f5f5f5; border: 1px solid Silver;"></div>


<button onclick="getAllChecked()">获取全部选中的节点</button><br><br>

<button onclick="getSelectedNode()">获取选中的节点</button><br><br>

<button onclick="getSelectedChecked()">选中的节点设为已选</button><br><br>

<button onclick="getSelectedUNChecked()">选中的节点设为不选中</button><br><br>

		<script>
		//获取选中节点的值
		function getSelectedNode(){
			alert(tree.getSelectedItemId());
		}
		//将鼠标点中的节点在checkbox选中
		function getSelectedChecked(){
			tree.setCheck(tree.getSelectedItemId(),true);
		}
		//将鼠标点中的节点在checkbox不选中
		function getSelectedUNChecked(){
			tree.setCheck(tree.getSelectedItemId(),false);
		}
		//获取所有checkbox中全部选中的节点
		function getAllChecked(){
			alert(tree.getAllChecked());
		}
		
		function clickFunc(id){
			alert("click Item " + tree.getItemText(id) + " was selected");
		}
		
		function dbclickFunc(id){
			//根据id获取内容的方法是 tree.getItemText(id)
			alert("dbclick Item " + tree.getItemText(id) + " was selected");
		}
		
		function checkedFunc(id){
			alert("checked Item " + tree.getItemText(id) + " was selected");
		}
		
		tree=new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0);

		tree.setSkin('dhx_skyblue');
		tree.setImagePath("dhtmlxtree/common/images/");
		tree.enableDragAndDrop(0);
		tree.enableTreeLines(false);
		tree.setImageArrays("plus","","","","plus.gif");
		tree.setImageArrays("minus","","","","minus.gif");
		tree.setStdImages("book.gif","books_open.gif","books_close.gif");	
		
		//是否使用checkbox
		tree.enableCheckBoxes(1);
		
		//1、选中子节点,是否让其parent节点也选中,2、选中父节点,子节点全部选中
		tree.enableThreeStateCheckboxes(true);
		
		//自定义事件
		tree.setOnCheckHandler(checkedFunc);//多选框是否被选中
		//tree.setOnClickHandler(clickFunc);//单机事件
		tree.setOnDblClickHandler(dbclickFunc);//双击事件
		
		//打开有子节点的父节点出现的方法
		tree.attachEvent("onOpenEnd", function(nodeId, event) {
		    alert("An id of open item is " + nodeId);
		});
		
		var json = {
			    id: 0,
			    item:[
			    	{
			    		id:"X1",
			    		text:"一",
			    		item:[
			    			{
			    				id:"X11",
				    			text:"一一"
			    			},
			    			{
			    				id:"X12",
				    			text:"一二"
			    			}
			    		]
			    	},
			    	{
			    		id:"X2",
			    		text:"二",
			    		item:[
			    			{
			    				id:"X21",
				    			text:"二一"
			    			},
			    			{
			    				id:"X22",
				    			text:"二二"
			    			}
			    		]
			    	}
			    ]
			};
		
		var jsondata = {id:0, item:[{id:1,text:"first"},{id:2, text:"middle", item:[{id:"21", text:"child"}]},{id:3,text:"last"}]};
		//tree.loadJSONObject(jsondata);
		tree.loadJSONObject(json,function(){
			
			//alert(1);
		});
		
		//动态添加的节点也能绑定之前设定的方法
		tree.insertNewChild(0,"hb","hb");
		
	</script>
</body>
</html>

 

 

如何使用dhtmlxtree 和Json 数据格式创建和使用一棵tree

(声明:本人自认为在Java界只是个不起眼的小菜鸟,若哪里有疏忽或者出错的地方还请各位海涵并且帮忙改正,最主要希望自己的学习中遇到的问题能很好的帮助你们) 先简单介绍下dhtmlxtree: dthm...
  • quniandongtian
  • quniandongtian
  • 2014年02月04日 09:54
  • 2311

【Unity3D】常用API学习笔记

【Unity3D】常用API学习笔记 1、MonoBehaviour类(UnityEngine命名空间中定义): Awake:最开始调用,做一些初始化工作。建议少用,此刻物体可能还没有实例化出来,会影...
  • woaini454186694
  • woaini454186694
  • 2016年05月25日 23:00
  • 9618

机器学习中几种常见优化方法总结

1、梯度下降法 假设f(x)是具有一阶连续偏导数的函数。要求解的无约束最优化问题是: 梯度下降法是一种迭代算法,选取适当的初值x(0),不断迭代更新x的值,进行目标函数的极小化,直到收敛。由于...
  • Shadow_Mi
  • Shadow_Mi
  • 2016年07月12日 17:22
  • 1363

dhtmlxtree学习笔记三(ajax动态获取数据)

前端代码 Easy skinable design
  • hbiao68
  • hbiao68
  • 2013年12月04日 10:27
  • 787

Java学习笔记之常用方法类(二) StringBuffer类、StringTokenizenizer类、Sanner类

以下是博主学java的时候记的一些笔记,分享给大家,如果有错误或者以为的话,可以在下方留言 StringBuffer类 StringBuffer对象的创建 String类创建的对象,创建之后不能...
  • yzzdmzdfq
  • yzzdmzdfq
  • 2016年05月04日 20:25
  • 182

Selenium学习笔记(二)——常用操作与方法简介

定位页面元素 Selenium使用WebDriver.findElement(By.locator())的方式定位页面元素。locator有下面几种方式: 方式 搜索依据 ...
  • gowhere_
  • gowhere_
  • 2017年07月16日 11:09
  • 231

Linux常用命令学习笔记(-)

  • 2012年09月12日 23:50
  • 275KB
  • 下载

Maven学习笔记--常用命令和设置

  • 2016年06月03日 10:44
  • 52B
  • 下载

linux学习笔记,最经常用的命令

  • 2009年12月25日 11:48
  • 33KB
  • 下载

最容易学的ADO.NET常用对象详解(头发乱了的学习笔记 - 博客园--转载)

  • 2008年07月02日 09:29
  • 547KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:dhtmlxtree学习笔记二(常用方法)
举报原因:
原因补充:

(最多只允许输入30个字)