You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.
<!DOCTYPE html>
< html >
< head >
< meta charset = "utf-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1, maximum-scale=1" >
< title > 树模块 - layui< / title >
< link rel = "stylesheet" href = "../src/css/layui.css" >
< style >
body { padding : 50 px 100 px ; }
< / style >
< / head >
< body >
< ul id = "demo" > < / ul >
< ul id = "demo1" style = "margin-top: 50px;" > < / ul >
< script src = "../src/layui.js" > < / script >
< script >
layui . use ( 'tree' , function ( ) {
var tree = layui . tree ( {
elem : '#demo' //指定元素
//,check: 'checkbox' //勾选风格
, skin : 'as' //设定皮肤
//,target: '_blank' //是否新选项卡打开（ ）
, drag : true
, click : function ( item ) { //点击节点回调
console . log ( item )
}
, nodes : [ //节点
{
name : '常用文件夹'
, id : 1
, alias : 'changyong'
, children : [
{
name : '所有未读'
, id : 11
//,href: 'http://www.layui.com/'
, alias : 'weidu'
} , {
name : '置顶邮件'
, id : 12
} , {
name : '标签邮件'
, id : 13
}
]
} , {
name : '我的邮箱'
, id : 2
, spread : true
, children : [
{
name : 'QQ邮箱'
, id : 21
, spread : true
, children : [
{
name : '收件箱'
, id : 211
, children : [
{
name : '所有未读'
, id : 2111
} , {
name : '置顶邮件'
, id : 2112
} , {
name : '标签邮件'
, id : 2113
}
]
} , {
name : '已发出的邮件'
, id : 212
} , {
name : '垃圾邮件'
, id : 213
}
]
} , {
name : '阿里云邮'
, id : 22
, children : [
{
name : '收件箱'
, id : 221
} , {
name : '已发出的邮件'
, id : 222
} , {
name : '垃圾邮件'
, id : 223
}
]
}
]
}
]
} ) ;
//生成一个模拟树
var createTree = function ( node , start ) {
node = node || function ( ) {
var arr = [ ] ;
for ( var i = 1 ; i < 10 ; i ++ ) {
arr . push ( {
name : i . toString ( ) . replace ( /(\d)/ , '$1$1$1$1$1$1$1$1$1' )
} ) ;
}
return arr ;
} ( ) ;
start = start || 1 ;
layui . each ( node , function ( index , item ) {
if ( start < 10 && index < 9 ) {
var child = [
{
name : ( 1 + index + start ) . toString ( ) . replace ( /(\d)/ , '$1$1$1$1$1$1$1$1$1' )
}
] ;
node [ index ] . children = child ;
createTree ( child , index + start + 1 ) ;
}
} ) ;
return node ;
} ;
layui . tree ( {
elem : '#demo1' //指定元素
, nodes : createTree ( )
} ) ;
} ) ;
< / script >
< pre class = "layui-code" >
# layui.tree-v2 备忘
* check参数 - checkbox、radio的支持
* 拖拽的支持
< / pre >
< / body >
< / html >
