jquery——zTree, 完美好用的树插件
这绝对是我见过最完美的tree了,尽管是国产货,但一点不输国外产品,国外的还没有见过这么强的。
__________________________________________________________________________________
以下是简单的使用demo:
<!DOCTYPE html>
<html>
<head>
<title>ZTREE DEMO - Standard Data </title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link href="css/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="js/jquery.ztree.core-3.4.js" type="text/javascript"></script>
<script type="text/javascript">
var setting = {
view: {
selectedMulti: false //禁止多点选中
},
data: {
simpleData: {
enable:true,
idKey: "id",
pIdKey: "pId",
rootPId: ""
}
},
callback: {
onClick: function(treeId, treeNode) {
var treeObj = $.fn.zTree.getZTreeObj(treeNode);
var selectedNode = treeObj.getSelectedNodes()[0];
$("#txtId").val(selectedNode.id);
$("#txtAddress").val(selectedNode.name);
}
}
};
var zNodes =[
{id:1, pId:0, name:"广东", open:true},
{id:101, pId:1, name:"广州", file:"core/standardData"},
{id:102, pId:1, name:"深圳", file:"core/simpleData"},
{id:103, pId:1, name:"东莞", file:"core/noline"}
]; $(document).ready(function(){
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
});
</script>
</head>
<body>
<div style="float:left;" >
<ul id="treeDemo" class="ztree">
</ul>
</div>
<div style="float:left;" >
id: <input id="txtId" type="text" value="" /><br />
地名:<input id="txtAddress" type="text" value="" />
</div>
</body>
</html>
jquery——zTree, 完美好用的树插件的更多相关文章
- zTree 优秀的jquery树插件
zTree 优秀的jquery树插件,文档详细,渲染快 使用方法: 1.引用zTree的js和css文件 <link href="~/Content/zTree_v3/css/zTre ...
- JQuery树插件——ztree
API与Demo:http://www.treejs.cn/v3/api.php 使用插件,第一步依然是引入: <link rel="stylesheet" href=&qu ...
- JQuery Ztree 树插件配置与应用小结
JQuery Ztree 树插件配置与应用小结 by:授客 QQ:1033553122 测试环境 Win7 jquery-3.2.1.min.js 下载地址: https://gitee.com/is ...
- zTree -- jQuery 树插件 使用方法与例子
简介 zTree 是一个依靠 jQuery 实现的多功能 "树插件". 网址:http://www.ztree.me/v3/main.php#_zTreeInfo 上面的网址里有z ...
- 主攻ASP.NET.4.5.1 MVC5.0之重生:在项目中使用zTree jQuery 树插件
效果图和json格式 Controllers代码 using HR.Models; using HR.Models.Repository; /***************************** ...
- Jquery ztree树插件
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- Jquery ztree树插件2
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- zTree:一个依靠 jQuery 实现的多功能 “树插件”
官方网站: http://www.treejs.cn/v3/main.php#_zTreeInfo 使用方式: 步骤1.文件准备 将需要使用的 zTree v3.x 相关的 js.css.img 文件 ...
- zTree -- jQuery 树插件实现点击文字展开子节点
新版本的zTree是单击+号展开子项,点击文字选中该项,双击文字展开子项 项目用的是3.5版本的,如果要点击文字展开子项暂时没查到资料,自己琢磨了下 项目用的是jquery.ztree.core-3. ...
随机推荐
- 获取EnterpriseLibrary企业库配置文件中ConnectionStrings(原创)
在使用企业类库时想取出单独企业配置文件中的连接字符串遍历,并放到自己的数据库处理类中,在查找了很久的资料后都没有找到,于是自己探索着写了一个,共享给大家以做参考: ConfigurationSourc ...
- C#获取显示器宽度高度,桌面宽度高度等
1.C#获取显示器宽度高度,桌面宽度高度等 //获取当前显示器的宽度和高度 int width = Screen.PrimaryScreen.Bounds.Width; int height = Sc ...
- (转)SQL流程控制语句学习(一):变量及控制语句种类
1.局部变量 用户自己定义的,称局部变量,以@标识. 作用范围:定义局部变量的批处理.存储过程.触发器和语句块 局部变量的定义: declare @局部变量名 数据类型 注意:变量的类型不能是text ...
- shell中if做比较
比较两个字符串是否相等的办法是: if [ "$test"x = "test"x ]; then 这里的关键有几点: 1 使用单个等号 2 注意到等号两边各有一 ...
- JAVA-1-HelloWorld
public class HelloWorld{ public static void main(String[] args){ System.out.println("HelloWorld ...
- 使用Scanner来解析文件
前面的流是全部流进来再处理,空间换取时间 我们用Scanner来解析文件,先处理再输入数据,时间换取空间 两种方法 Scanner scanner1=new Scanner(file1); for(; ...
- Yandex 2013Q(Atoms: There and Back Again-贪心+模拟+List)
Atoms: There and Back Again Time limit 2 seconds Memory limit 256Mb Input stdin Output stdout Legend ...
- 多线程08-Callable和Future
1.简介 Callable是一个接口,与Runnable类似,包含一个必须实现的call方法,可以启动为让另一个线程来执行,执行Callable可以得到一个Future对象 该对象可以监听Callab ...
- Secure CRT 如何连接虚拟机里面的CentOS系统 当主机没有网的时候 作者原创 欢迎转载
当家里没有网络的时候: 1.第一步:首先保证主机所有的网卡都没有分享连接给VM8这一块网卡 如图:这个设置就保证了无线网络连接这块网卡没有分享给VM8这一块网卡 第二步:启用VM8这一块网卡,右键en ...
- SQL Server 触发器(转)
触发器是一种特殊类型的存储过程,它不同于之前的我们介绍的存储过程.触发器主要是通过事件进行触发被自动调用执行的.而存储过程可以通过存储过程的名称被调用. Ø 什么是触发器 触发器对表进行插入.更新.删 ...