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. ...
随机推荐
- Java类与类之间关系总结
继承,依赖,关联,聚合,组合 一般来说依赖和关联是类似的,关联是强依赖,聚合和组合是一类,组合属于强聚合. 继承:一般是子类和父类之间的关系,关键字extends 依赖:可以这样记忆,做某件事必须要依 ...
- java的final变量理解
java的final变量理解 final基本类型是数值不能改变 final对象是引用不能改变,对象其自身是可以被修改的.
- JAVA关键词synchronized的作用
记下来,很重要. Java语言的关键字,当它用来修饰一个方法或者一个代码块的时候,能够保证在同一时刻最多只有一个线程执行该段代码. 一.当两个并发线程访问同一个对象object中的这个synchron ...
- start with connect by prior学习
这是oracle中的树查询,查询出来的数据会根据上下级组成树的结构.select * from mw_sys.mwt_pd_deps start with obj_id = '63EBEC8E-E76 ...
- Android应用开发中关于this.context=context的理解
在Android应用开发中,有的类里面需要声明一个Context的成员变量,然后还需要在该类的构造函数中加上this.context=context;这行代码.为什么要这么写呢?不写不行么? 先看下面 ...
- 学习笔记之AJAX无刷新分页
利用AJAX实现无刷新分页技术原理: 其主要是利用AJAX的异步处理机制,实现数据的异步传递,它隐藏了客户端向服务端请求数据的状态,在客户端表现为无刷新的显示状态. 实现分页的步骤: 1.客服端点击页 ...
- 百度文本编辑器 Ueditor for net 使用七牛存储附件的实现
百度编辑器功能强大,确实好用,可惜附件使用本地存储,如果网站的用户量巨大,则会使得网站目录变得非常庞大,而且文件不易于管理,七牛云存储在附件存储方面下了不少功夫,用起来感觉不错,要是将ueditor ...
- 使用Statement执行sql语句
import java.sql.Connection; import java.sql.DriverManager; import java.sql.SQLException; import java ...
- error on line 1 at column 6: XML declaration allowed only at the start of the document
This page contains the following errors: error on line 1 at column 6: XML declaration allowed only a ...
- 修改apk显示或隐藏桌面图标
反编译CM设置,打开AndroidManifest.xml,搜索“DEFAULT”,把他替换为"LAUNCHER",然后回编译,回编译之后签名在用RE放到system\app下该权 ...