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. ...
随机推荐
- 第二章 控件架构与自定义控件详解 + ListView使用技巧 + Scroll分析
1.Android控件架构下图是UI界面架构图,每个Activity都有一个Window对象,通常是由PhoneWindow类来实现的.PhoneWindow将DecorView作为整个应用窗口的根V ...
- Nginx 反向代理配置实例（转）
user www www; worker_processes ; error_log logs/error.log notice; pid logs/nginx.pid; worker_rlimit_ ...
- SQL Server 2005、SQL Server 2008版本比较
SQL Server 2005的版本有SQL Server 2005企业版(Enterprise).SQL Server 2005标准版(Standard) 和SQL Server 2005工作组版( ...
- 查看SQL server服务名
net start MSSQL$SQLEXPRESS 启动服务命令 net stop MSSQL$SQLEXPRESS 关闭服务命令 网上看到的那些 我都用不了 最后想起了这个 现在好了
- c++虚函数的学习
1.虚函数 #include<iostream.h> class Base { public: void print() { cout<<"Base"< ...
- Linux入门 (笔记)
Man can conquer nature. "人定胜天" 一.基本操作 1.重要快捷键 Tab 补全命令.目录.参数.文件名等 Ctrl+c 强制终止当前的程序 Ctrl+ ...
- Windows 中JDK安装配置教程
1.准备工作 a.因为Java JDK区分32位和64位系统,所以在安装之前必须先要判断以下我们的系统为多少位系统.右键计算机-属性查看,我安装的是64位 b.下载JDK,地址:http://www. ...
- 测试RegExp对象的属性
//测试RegExp对象的属性function testRegExpProperty(){ var regexp = /abc/; //regexp.ignoreCase = true; //无效 c ...
- phpcms v9 读取地区联动菜单缓存文件
读取缓存文件的方法是 getcache() 在 phpcms\libs\functions\global.func.php 中可找到. 地区联动菜单的缓存文件是 caches\caches_link ...
- postgres安装 以及修改postgres 密码
#postgres安装 apt-get install postgresql-9.3 postgresql-client-9.3 postgresql-contrib-9.3 postgresql-s ...